"process is not defined" error after react eject

Question

After running yarn eject in my react project,I get the 'process' is not defined error when calling registerServiceWorker() in index.js. files in scripts and config directories are not modified.

I get the same error for module variable.

Answer 1

This happens because React uses process.env to determine whether you're in a development or production environment. From getting-started.md:

Note: by default, React will be in development mode, which is slower, and not advised for production. To use React in production mode, set the environment variable NODE_ENV to production (using envify or webpack's DefinePlugin).

For example:

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

So to build it with Rollup, you need to replace process.env.NODE_ENV with either "development" or "production" – you can use rollup-plugin-replace for this:

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