Create asset filenames mapping on the build output (#891)

* Create asset filenames mapping on the build output

I use danethurber/webpack-manifest-plugin on Webpack production
configuration to create a file named `asset-manifest.json` which contain a
mapping of all asset filenames to their corresponding output file.

`asset-manifest.json` will be located at the root of output folder.

This'll resolve #600

* Add an explanation for ManifestPlugin

* Make webpack-manifest-plugin's version exact

Author: lukyth

packages/react-scripts/config/webpack.config.prod.js

@@ -14,6 +14,7 @@ var autoprefixer = require('autoprefixer');
 var webpack = require('webpack');
 var HtmlWebpackPlugin = require('html-webpack-plugin');
 var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var ManifestPlugin = require('webpack-manifest-plugin');
 var InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 var url = require('url');
 var paths = require('./paths');
@@ -250,7 +251,13 @@ module.exports = {
       }
     }),
     // Note: this won't work without ExtractTextPlugin.extract(..) in `loaders`.
-    new ExtractTextPlugin('static/css/[name].[contenthash:8].css')
+    new ExtractTextPlugin('static/css/[name].[contenthash:8].css'),
+    // Generate a manifest file which contains a mapping of all asset filenames
+    // to their corresponding output file so that tools can pick it up without
+    // having to parse `index.html`.
+    new ManifestPlugin({
+      fileName: 'asset-manifest.json'
+    })
   ],
   // Some libraries import Node modules but don't use them in the browser.
   // Tell Webpack to provide empty mocks for them so importing them works.

packages/react-scripts/package.json

@@ -65,6 +65,7 @@
     "url-loader": "0.5.7",
     "webpack": "1.13.2",
     "webpack-dev-server": "1.16.1",
+    "webpack-manifest-plugin": "1.0.1",
     "whatwg-fetch": "1.0.0"
   },
   "devDependencies": {