React 在使用 create-react-app 时将持续构建文件放在哪里

Question

我正在使用 create-react-app。当我运行 npm start (react-scripts start) 时，它会不断为我构建变化并发挥它的魔力。但是它的输出文件夹是什么？我知道当我手动构建它时，文件去了哪里。

我想使用 firebase 模拟器为我的 React all 的当前版本（连续构建）提供服务，但我不明白输出文件夹在哪里或如何实现它。

Answer 1

tl;dr

运行npm run build，不是npm run start

更多详情

react-scripts start 运行s webpack-dev-server 内部。作为默认设置，webpack-dev-server 从内存中提供捆绑文件并且不将文件写入目录。如果你想用 webpack-dev-sever 写入文件，你可以在你的开发服务器配置中将 writeToDisk 选项设置为 true。

但是，我认为这不是您想在 firebase 模拟器上提供的服务。 Webpack-dev-server 不会为生产构建最佳应用程序，您还需要使用 react-app-rewired 在 cra 模板中自定义开发服务器配置。

你想要做的是npm run build到运行react-scripts build，它在/build目录中构建优化的生产应用程序。

Answer 2

你可以试试这个包https://github.com/Nargonath/cra-build-watch

安装它并将脚本添加到您的 package.json

{
  "scripts": {
    "watch": "cra-build-watch"
  }
}

和运行它

npm run watch

这里有更多信息

https://ibraheem.ca/writings/cra-write-to-disk-in-dev/

如果您转到文章中链接的 React 存储库 issue，您会发现更多解决方法

React 在使用 create-react-app 时将持续构建文件放在哪里

Where does React put the continuous build files when using create-react-app

firebase

reactjs

firebase-tools

create-react-app