Skip to content

Commit

Permalink
Fix Webpack config including extracting the manifest
Browse files Browse the repository at this point in the history
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.
  • Loading branch information
KyleAMathews committed Sep 28, 2016
1 parent 94581a9 commit 0941d33
Show file tree
Hide file tree
Showing 2 changed files with 20 additions and 8 deletions.
27 changes: 19 additions & 8 deletions lib/utils/webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -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}/` : `/`,
}
Expand Down Expand Up @@ -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({
Expand All @@ -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}/` : `/`,
Expand All @@ -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:
Expand Down Expand Up @@ -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`),
]
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -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": {
Expand Down

0 comments on commit 0941d33

Please sign in to comment.