Optimize the production build (#49)

Inspired by react-boilerplate setup

Author: gaearon

config/webpack.config.prod.js

@@ -11,6 +11,7 @@ var path = require('path');
 var autoprefixer = require('autoprefixer');
 var webpack = require('webpack');
 var HtmlWebpackPlugin = require('html-webpack-plugin');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
 
 var isInNodeModules = 'node_modules' ===
   path.basename(path.resolve(path.join(__dirname, '..', '..')));
@@ -22,7 +23,8 @@ module.exports = {
   entry: './src/index.js',
   output: {
     path: path.resolve(__dirname, relative, 'build'),
-    filename: '[name].[hash].js',
+    filename: '[name].[chunkhash].js',
+    chunkFilename: '[name].[chunkhash].chunk.js',
     // TODO: this wouldn't work for e.g. GH Pages.
     // Good news: we can infer it from package.json :-)
     publicPath: '/'
@@ -49,7 +51,7 @@ module.exports = {
       {
         test: /\.css$/,
         include: path.resolve(__dirname, relative, 'src'),
-        loader: 'style!css!postcss'
+        loader: ExtractTextPlugin.extract('style', 'css!postcss')
       },
       {
         test: /\.json$/,
@@ -93,6 +95,7 @@ module.exports = {
     }),
     new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"production"' }),
     new webpack.optimize.OccurrenceOrderPlugin(),
+    new webpack.optimize.DedupePlugin(),
     new webpack.optimize.UglifyJsPlugin({
       compressor: {
         screw_ie8: true,
@@ -105,6 +108,7 @@ module.exports = {
         comments: false,
         screw_ie8: true
       }
-    })
+    }),
+    new ExtractTextPlugin('[name].[contenthash].css')
   ]
 };

package.json

@@ -44,6 +44,7 @@
     "eslint-loader": "1.4.1",
     "eslint-plugin-import": "1.10.3",
     "eslint-plugin-react": "5.2.2",
+    "extract-text-webpack-plugin": "1.0.1",
     "file-loader": "0.9.0",
     "html-webpack-plugin": "2.22.0",
     "json-loader": "0.5.4",
@@ -77,6 +78,7 @@
     "eslint-loader",
     "eslint-plugin-import",
     "eslint-plugin-react",
+    "extract-text-webpack-plugin",
     "file-loader",
     "html-webpack-plugin",
     "json-loader",