node.js - create-react-app + nodejs (express) 服务器

Question

我在我的应用程序中使用 NodeJs + React。我在 NodeJs 中使用 express。我使用“create-react-app”npm 创建了我的示例应用程序。

我使用 NodeJs 从 react 应用程序调用 oauth token 。我在这篇文章中提到了这种方法 Calling a secured REST api from Javascript without user login screen .

我在下面添加了这个命令来启动 NodeJs 和我的 react 应用程序。有用。

"scripts": {
  "node": "react-scripts-ts build & node server"
}

问题是我没有获得“create-react-app”附带的实时跟踪功能，因为我没有启动 webpack-dev-server。如果我做了一些更改，我必须运行 'yarn node' 来重新编译并启动 Node js 服务器。

我的问题是如何在不丢失“create-react-app”实时跟踪功能的情况下启动 nodejs express。

如果我需要弹出'create-react-app'并自定义脚本，只要我有以下功能就可以了。

• 启动 nodejs express - api
• 加载我的 react-app
• 如果我的 react 或 nodejs express 文件有任何变化，它应该会自动重新加载。

如果您有任何问题，请随时告诉我。

谢谢，

Answer 1

有一个很好的教程来处理这个设置:https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/

总结一下:你可以用你习惯的任何方式编写你的 node+express 服务器 - 我们会说它位于一个名为 project 的目录中 - 然后 嵌套在其中 使用 create-react-app 创建的前端目录，例如项目/客户.

在开发时，您实际上会运行两台服务器:后端服务器 (npm start) 和嵌套的 create-react-app 附带的 webpack-dev-server (cd 客户端 && npm 启动)。在您的浏览器中，您将导航到 webpack-dev-server 提供的 url(默认为 localhost:3000)。

在生产中，您不需要运行两台服务器。您将捆绑您的前端(cd client && npm run build)，然后您的后端服务器只需要为捆绑提供服务，例如通过 express 的静态中间件:

if (process.env.NODE_ENV === 'production') {
    app.use(express.static('client/build'))
}

我跳过了一些细节，所以如果这个设置听起来适合你，请查看我链接的教程。