我如何忽略在create-react-app 中观看node_modules？

Question

当我运行“npm start”时，出现以下错误：

...
...
Watchpack Error (watcher): Error: ENOSPC: System limit for number of file watchers reached, watch '/my_project/node_modules/@babel/runtime/helpers'
/my_project/node_modules/react-scripts/scripts/start.js:19
  throw err;
  ^

Error: ENOSPC: System limit for number of file watchers reached, watch '/my_project/src'
...
...

我使用的是公司机器，所以我无法增加观看人数限制。

我在网上读到我应该转到“node_modules/react-scripts/config/webpackDebServer.config.js”并确保忽略node_modules目录。

我尝试了一整天，但每次尝试运行 React 应用程序都会出现相同的错误消息。

知道如何克服这个问题吗？如何让webpack忽略node_modules？

谢谢！

Answer 1

我也在寻找同样的答案。我花了一段时间才找到解决方案。

解决方案是编辑node_modules/react-scripts/config/webpack.config.js

你应该找到这样的模式：

const ...

...

module.exports = function (webpackEnv){
    ...
    return {
        target: ...
        ....
    }
}

解决方案是在 return 块中添加 watchOptions。

例如：

module.exports = function (webpackEnv){
    ...
    return {
        target: ...
        ....
        watchOptions: {
            ignored: /node_modules/,
        }
    }
}

感谢这个 stackoverflow 答案的作者。

Answer 2

这是受到@AbuSufian 答案的启发

我将代码添加到文件末尾以应用设置。

const prev_mod_exports = module.exports
module.exports = function (webpackEnv) {
    let exports = prev_mod_exports(webpackEnv);
    let watchOptions = exports.watchOptions = exports.watchOptions || {};
    watchOptions.ignored = watchOptions.ignored || [];
    watchOptions.ignored.push("/node_modules/");
    return exports;
}

我使用的是 devcontainers，热重载非常慢，因为 node_modules 中有 500K 个文件。

我使用下面的 postCreateCommand 来修补 devcontainer.json 中的文件 如果文件中不存在字符串 prev_mod_exports，则应用上述代码的缩小版本。

{
"postCreateCommand": "npm install && if [[ $(grep -L prev_mod_exports node_modules/react-scripts/config/webpack.config.js) ]]; then echo 'const prev_mod_exports=module.exports;module.exports=function(webpackEnv){let exports=prev_mod_exports(webpackEnv),watchOptions=exports.watchOptions=exports.watchOptions||{};return watchOptions.ignored=watchOptions.ignored||[],watchOptions.ignored.push(\"/node_modules/\"),exports};' >> node_modules/react-scripts/config/webpack.config.js; fi && cat node_modules/react-scripts/config/webpack.config.js && npm run-script start"
}