React-app-rewired: Production build is empty

[bilthon]

I've followed this tutorial in order to add support for Workers on my CRA.

I had to modify the config-overrides.js, which now looks like this:

module.exports = function override(config, env) {
    config.module.rules.push({
        test: /\.worker\.js$/,
        use: { loader: 'worker-loader' }
      });
    config.output['globalObject'] = 'this';
    return config;
}

And everything runs smoothly while testing. But just as I was trying to create a production build I realized the build directory contains nothing more than the favicon.ico and the manifest.json file.

What could I be missing?

[leifdejong]

@bilthon do you have any logs from the build?

[bilthon]

I solved this issue already, I just forgot about closing it, I'm sorry.

The problem in my case is that I was using react-app-rewired in order to create some WebWorkers in my react app using the worker-loader lib. The issue was solved by adding a lint line at the lines of code which made reference to the self keyword. The line itself is this one:

  self.postMessage(result); // eslint-disable-line no-restricted-globals

I don't think this was an issue with react-app-rewired itself, but since I got no logs or anything I could not rule that out. Where do I get those by the way?

[leifdejong]

When you run npm build, npm start, or npm test, you should be able to see the logs on the console. It's strange if you have no logs showing up but glad you figured it out. Let us know if anything else comes up. Thanks!

[ortonomy]

I'm getting exactly this issue too, and the eslint thing fixed it! Wooohooo. Thank you @leifdejong .

[mib32]

There can be other ESLint errors than that, and the bigger problem is that when we are using react-app-rewired with worker-loader - during build the ESLint do not show any output for worker files.

For me, workaround looks like this, run this command from your app dir:

 npx eslint ./PATH_TO_YOUR_WORKER_FILE -c ./node_modules/eslint-config-react-app/index.js

This will show any errors preventing build. Have a good coding.

Also, for the restricted globals, it's easier to just put /* eslint no-restricted-globals: 0 */ on top of the worker file.