Progressive Web Apps with React

Webpack configuration

Our strategy, as discussed earlier, goes like this: we want to split our bundle.js into separate chunks, based on the route.

The purpose of this section is to do two things: one, set up a naming convention for the chunks of JavaScript, and two, add support for conditional imports (more on those soon).

Open up webpack.config.prod.js and let's do the first step (this only applies to the PRODUCTION build, so only modify our production Webpack config; we don't need code splitting in development).

As it stands, our output configuration looks like this:

output: {   path: __dirname + "/build",   filename: "bundle.js",   publicPath: './'},

We create a single JavaScript file in our build folder, named bundle.js.

Let's change this whole ...