反应弹出后出现“未定义过程”错误

Question

在我的react项目中运行yarn eject后，在 index.js 中调用'process' is not defined时出现registerServiceWorker()错误。 脚本和 config 目录中的文件未修改。

module变量出现相同的错误。

Answer 1

之所以发生这种情况，是因为React使用process.env来确定您是处于开发环境还是生产环境中。从Getting.started.md：

注意：默认情况下，React将处​​于开发模式，这是较慢的，不建议用于生产。要在生产模式下使用React，请将环境变量NODE_ENV设置为生产（使用envify或Webpack的DefinePlugin）。

例如：

new webpack.DefinePlugin({
  "process.env": {
    NODE_ENV: JSON.stringify("production")
  }
});

因此，要使用Rollup构建它，您需要将process.env.NODE_ENV替换为“ 开发”或“ 生产” –您可以使用rollup-plugin-替换为：

rollup({
  entry: 'main.js',
  plugins: [
    replace({
      'process.env.NODE_ENV': JSON.stringify( 'production' )
    })
  ]
}).then(...)

Answer 2

由于没有太多有关您的设置的详细信息，我的答案是假设您使用的create-react-app是具有eject命令概念的最常用工具。

您使用的是this change之前发布的CRA版本，将registerServiceWorker文件重命名为serviceWorker和disabling SW by default，因此基于<=1.1.5的版本在发布标签上。

CRA的Service Worker可以缓存您的资产，因此您的应用程序仍可以脱机工作。如果您不需要此功能，则解决该错误的一件简单的事情就是禁用registerServiceWorker调用，因为这也是他们在模板中所做的。

一个更痛苦的选择是将您的项目实际升级到CRA 2.x，但从长远来看可能值得这样做，以使退出的项目尽可能地接近原始位置。有升级指南，您可以查看here。

我本人使用最新版本创建了一个新的CRA项目，并在启用服务工作者时将其弹出，并且没有遇到您遇到的任何此类问题，因此当然也要考虑一下。