如何在React中创建SPA以通过SSI包含

Question

我们的任务是为另一个团队创建一个微服务前端。我们希望在React中创建它，而我们正在构建它的组想要通过SSI将其包含在其更大的页面中。我已经设置了自己的Nginx服务器，并创建了一个测试页面，以包含我的基本反应应用程序，这包括页面的内容。但是，反应页面的内容指向了bundle.js，0.chunk.js等相关URL。 main.chunk.js;我已经在Nginx中设置了这个规则以便将它们带到原点，但这不太理想，我仍然在其他资源上得到404的反应正在试图引入。

解决这个问题的最佳方法是什么？有没有办法让React将其所有资源捆绑到一个文件中？或者我们试图做的只是不可行？

这是我用来包含我的反应应用程序的nginx文件的一部分：

location /test.html {
    ssi on;
    proxy_set_header Accept-Encoding ""; 
    proxy_pass http://local.react.com:3000/;        
}

我添加了更多这些来从反应应用程序引入JS，反应插入到页面中。

我包含它的页面只包括：

<!--#include virtual="test.html" -->

Answer 1

您可能需要更改一些配置选项。检查create-react-app documentation关于PUBLIC_URL设置或关于output.publicPath设置的webpack文档。