如何使用create-react-app和Spring Boot？

Question

我正在尝试将一个ReactJS应用与使用Spring Boot构建的API一起提供。我已经在/public/目录下运行了create-react-app脚本，如下图所示。但是，当我从http://localhost:8080/public/index.html访问时，ReactJS中的所有相对路径似乎都无法正常工作。

要正确加载ReactJS资源，我还需要做什么？

结构如下图所示：

- Humble Student

Answer 1

我建议您创建两个项目：

• 一个用于Spring Boot后端;
• 一个用于React前端，使用create-react-app创建。

在开发模式下，您需要使用node运行React开发服务器：'npm start'。 您应该为您的Spring Boot应用程序定义代理："proxy": "http://localhost:8080"，并将其添加到您的package.json中。这种机制的文档在这里。 然后您可以像往常一样使用Gradle执行后端代码：./gradlew bootRun。

在生产部署中，您可以使用npm run build生成React应用程序的构建版本。由create-react-app生成的静态文件可以放置在您的Spring Boot应用程序中的静态目录中，例如src/main/resources/static/ (有关Spring Boot静态内容的文档)。

希望这可以帮到您！

- Chris B

---

太棒了，我会测试一下！非常感谢你。 - Humble Student

请注意，如果您选择这条路线，在生产系统中最好使用Docker将它们捆绑在一起，这样两个系统就可以在同一主机上启动，并且配置的代理在生产环境中继续工作，而不需要在构建过程中编辑package.json文件。 - Chris Browne