如何 运行 create-react-app 构建版本

Question

我创建了一个测试 React 应用程序，并使用 create-react-app 启动了它。我使用 yarn start 启动它，但这会启动应用程序的调试版本。我做了 npm 运行 build 并创建了构建文件夹，但是当我从 / 执行 yarn start 时build 文件夹，它仍然启动应用程序的调试版本。我需要这个来测试优化版本的性能。我该如何解决？

Answer 1

您正尝试使用 create-react-app 从开发构建迁移到生产构建，您需要使用网络服务器部署它，我建议使用设置简单的 Heroku or a droplet or you can use Netlify使用以下命令的过程：

cd project-name
npm run build

npm install netlify-cli -g
netlify deploy

Follow command line prompts and choose yes for new project and ./build as your deploy folder and voila you have a production React app!

您可以使用 , nginx, express

在本地托管应用程序

Answer 2

如果你想 运行 你的应用程序在浏览器中使用从文件系统本地提供的构建文件（即没有网络服务器），你可以把它放在你的 package.json:

"homepage": ".",

现在

1. 使用 npm run build 构建您的应用程序。
2. 在浏览器中启动 <your app>/build/index.html。

注意：如果您的应用（或某些路由库）正在使用 HTML5 pushState 历史记录 API，则不建议使用此解决方案。 https://facebook.github.io/create-react-app/docs/deployment#serving-apps-with-client-side-routing

Answer 3

您实际上可以使用静态服务器 运行 构建您的应用程序版本。 serve 是可行的。您可以使用以下方法对其进行测试：

npm run build

npx serve -s build

Answer 4

首先在您的应用程序目录中导航。

根据官方 create-react-app 网站。当您 运行 npm run build 或 yarn build 时，您会创建一个 build 目录，其中包含您的应用程序的生产版本。

在 运行 执行上面的命令之后，您可以检查应用程序的构建版本的下一件事是安装 serve 以在端口 上为您的静态站点提供服务默认为 5000。

npm install -g serve
serve -s build

这会将 link 复制到剪贴板，您可以将其粘贴到浏览器中并查看应用的构建版本。