node.js - 如何在 React 应用程序中禁用文件监视

Question

编辑:

我现在的问题是，是否可以在类似生产的环境中启动带有反应脚本的 react 应用程序，在这种环境中，我不一定希望对文件进行更改来影响正在运行的 react 服务器。请查看下面 C 下的“解决方案”部分，了解我已经尝试过的内容的简要说明。

过去两周我一直在为这个问题苦苦挣扎，但我不确定如何继续。我想在 Node Azure Web 应用程序 (Linux) 上托管我的 React 应用程序。

我看到的问题:

Starting the development server...

events.js:170
      throw er; // Unhandled 'error' event
      ^

Error: ENOSPC: System limit for number of file watchers reached, watch 'xxx'
    at FSWatcher.start (internal/fs/watchers.js:165:26)
    at Object.watch (fs.js:1274:11)
    at createFsWatchInstance (/home/u/work/some-repo/node_modules/chokidar/lib/nodefs-handler.js:37:15)
    at setFsWatchListener (/home/u/work/some-repo/node_modules/chokidar/lib/nodefs-handler.js:80:15)
    ...
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! some-repo@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the some-repo@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/u/.npm/_logs/2019-08-30T09_50_59_595Z-debug.log

尝试的解决方案:

在线阅读此问题后，我了解到解决方案可能涉及

答:系统上没有空间。我已经使用 df -h 检查过看起来有足够的空间(我的机器至少有 50%)。

B:已达到文件观察器限制，这似乎是问题所在，但不幸的是 Azure Web App 是只读文件系统，并且运行类似 echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p 的内容没有帮助。

C:禁用 React 观看。然而，我似乎无法做到这一点，如果有人知道如何使用 React 禁用观看，我将非常感激。到目前为止我已经尝试过CI=true npm start无济于事(当我运行命令并对文件进行更改时，该更改已主动反射(reflect)在我的浏览器上: localhost:3000

我还尝试在 node_modules/react-scripts/webpack.config.js 内添加多个选项例如: watch: false和ignore:/node_modules/ .

谢谢，尼克

Answer 1

我建议您重新考虑您的目标在类似生产的环境中启动带有react-scripts的react应用程序。

正如@adamz4008提到的，您不应该在生产环境中运行开发服务器。因此，您不会遇到观看问题，也不需要解决它。

文档/最佳实践

根据软件开发最佳实践，开发有不同的阶段。

Facebook React 文档也涵盖了它们。

1. 本地开发

   npm start/yarn start

   Runs the app in development mode.

   https://github.com/facebook/create-react-app#npm-start-or-yarn-start

2. 构建

   npm run build/yarn build

   Builds the app for production to the build folder.

   It correctly bundles React in production mode and optimizes the build for the best performance.

   The build is minified and the filenames include the hashes.

   Your app is ready to be deployed.

   https://github.com/facebook/create-react-app#npm-run-build-or-yarn-build

   安装 NPM 依赖项

   顺便说一句，通常人们在 npm run build 之前运行 npm install 来安装所有必要的依赖项。

   但我建议使用npm ci。具有确定性稳定的结果和更高的性能。

   https://docs.npmjs.com/cli/ci.html

3. 发布/部署

   由于您的应用程序只是一堆静态文件，因此您可以简单地将其作为静态 HTML 网站部署到任何 Web 服务器/平台。

我的经历

根据我使用 Azure 的实践经验，我将 React 应用程序作为静态网站部署到存储帐户(无需显式使用/配置任何 Web 服务器)。

https://learn.microsoft.com/en-us/azure/storage/blobs/storage-blob-static-website

您可以选择任何其他选项。