React + webpack in production06 Mar 2016
React comes with a lot helpers that are useful in development but not needed in production. In the documentation it is recommended to run your build task using
NODE_ENV=production to remove extraneous part of React's code, such as warning messages. Which allows us to save CPU time when executing the code in the browser and reduce the file size for production.
In my first attempt, I set different options for Uglify and ran the command
NODE_ENV=production webpack -p.
The output was indeed minified but warning messages were still in the code.
This is due to the fact that webpack doesn't transform by default
process.env values. (In our case
process.env.NODE_ENV.) Therefore, we need to use
webpack.DefinePlugin to achieve that.
Now, by running
NODE_ENV=production webpack -p, warning messages are removed from the output and in my case it reduced by 9% the file size.