Fix Webpack config including extracting the manifest

This improves Gatsby's caching story as the manifest changes on every
build. Normally it's put into the entry file (commons.js) which means
this would normally change on every build. By removing it, commons.js
should stay cachable for much longer.

lib/utils/webpack.config.js

@@ -56,7 +56,8 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
  case `build-javascript`:
  return {
  //filename: '[name].js',
- filename: `[name]-[chunkhash:8].js`,
+ filename: `[name]-[chunkhash].js`,
+ chunkFilename: `[name]-[chunkhash].js`,
  path: `${directory}/public`,
  publicPath: program.prefixLinks ? `${siteDB().get(`config`).linkPrefix}/` : `/`,
  }
@@ -144,7 +145,6 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
  new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
  new WebpackMD5Hash(),
  new webpack.optimize.DedupePlugin(),
- new webpack.optimize.OccurenceOrderPlugin(),
  // Extract "commons" chunk from the app entry and all
  // page components.
  new webpack.optimize.CommonsChunkPlugin({
@@ -164,14 +164,19 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
  // of unused code on the initial opening of the app.
  minChunks: Math.floor(components.length / 2),
  }),
+ // Add a few global variables. Set NODE_ENV to production (enables
+ // optimizations for React) and whether prefixing links is enabled
+ // (__PREFIX_LINKS__) and what the link prefix is (__LINK_PREFIX__).
  new webpack.DefinePlugin({
  'process.env': {
  NODE_ENV: JSON.stringify(process.env.NODE_ENV ? process.env.NODE_ENV : `production`),
  },
  __PREFIX_LINKS__: program.prefixLinks,
  __LINK_PREFIX__: JSON.stringify(siteDB().get(`config`).linkPrefix),
  }),
+ // Extract CSS so it doesn't get added to JS bundles.
  new ExtractTextPlugin(`styles.css`),
+ // Enable the offline plugin to add a service worker.
  new OfflinePlugin({
  //AppCache: false,
  publicPath: program.prefixLinks ? `${siteDB().get(`config`).linkPrefix}/` : `/`,
@@ -180,13 +185,20 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
  events: true,
  },
  }),
+ // Minify Javascript.
  new webpack.optimize.UglifyJsPlugin(),
+ // Write out mapping between chunk names and their hashed names. We use
+ // this to add the needed javascript files to each HTML page.
  new StatsWriterPlugin(),
- //new ChunkManifestPlugin({
- //filename: "chunk-manifest.json",
- //manifestVariable: "webpackManifest"
- //}),
- // inline manifest in head, atom.xml as "page"
+ // Extract the webpack chunk manifest out of commons.js so commons.js
+ // doesn't get changed everytime you build. This increases the cache-hit
+ // rate for commons.js.
+ new ChunkManifestPlugin({
+ filename: "chunk-manifest.json",
+ manifestVariable: "webpackManifest"
+ }),
+ // Ensure module order stays the same. Supposibly fixed in webpack 2.0.
+ new webpack.optimize.OccurenceOrderPlugin(),
  ]
  }
  default:
@@ -372,7 +384,6 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
 
  function resolveLoader () {
  const root = [
- path.resolve(__dirname, '..', 'loaders'),
  path.resolve(directory, `node_modules`),
  path.resolve(directory, `node_modules/gatsby/node_modules`),
  ]

package.json

@@ -99,6 +99,7 @@
  "webpack-md5-hash": "0.0.5",
  "webpack-require": "0.0.16",
  "webpack-stats-plugin": "^0.1.3",
+ "webpack-validator": "^2.2.7",
  "yaml-js": "^0.1.4"
  },
  "devDependencies": {