"Setup & Build Tools" doesn't explain the crucial development/production difference

[gaearon]

Like many beginner-oriented tutorials, it doesn't mention the difference between development and production builds. Unfortunately, this leads to people shipping development builds to production.

If the guide only used Create React App, this would not be a large problem since CRA strictly divides development (npm start) and production (npm run build) environments. However this is a section that tries to explain Webpack/Babel alone. I'm worried that people learning using that section will get the impression that the result is production-ready. (It's not.)

I think that if the guide chooses to explain Webpack rather than use CRA, it also needs to explain development/production configs, and show examples of both. It is important to teach people to think about these as two separate environments, and that one must never deploy a development bundle to production.

[dabbott]

Good thinking!

What would you recommend for a bare minimum production-ready build for a React app? Is webpack -p sufficient?

[gaearon]

No, it's not sufficient. You also need to add DefinePlugin. I really recommend to have two configs because even if -p works for some cases, people will add DEV-only stuff there by mistake.

We have official instructions for configuring Webpack for production.

https://facebook.github.io/react/docs/optimizing-performance.html#webpack