From e2ca7a65b343caef37a84a57bf13569d774f1b2a Mon Sep 17 00:00:00 2001 From: Kanitkorn S Date: Tue, 11 Oct 2016 20:02:37 +0700 Subject: [PATCH 1/3] 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 --- packages/react-scripts/config/webpack.config.prod.js | 6 +++++- packages/react-scripts/package.json | 1 + 2 files changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index 03fa1414471..b4991214c46 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/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,10 @@ 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'), + 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. diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json index 5b8c5540179..d534fb758c6 100644 --- a/packages/react-scripts/package.json +++ b/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": { From 43d4239e869fc81c930147156c08910a0622dc0a Mon Sep 17 00:00:00 2001 From: Kanitkorn S Date: Tue, 11 Oct 2016 20:35:20 +0700 Subject: [PATCH 2/3] Add an explanation for ManifestPlugin --- packages/react-scripts/config/webpack.config.prod.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index b4991214c46..fa787d43ea7 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/packages/react-scripts/config/webpack.config.prod.js @@ -252,6 +252,9 @@ module.exports = { }), // Note: this won't work without ExtractTextPlugin.extract(..) in `loaders`. 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' }) From 33b89abb39634bc2e54278c9e259be9784d3039e Mon Sep 17 00:00:00 2001 From: Kanitkorn S Date: Tue, 11 Oct 2016 20:36:41 +0700 Subject: [PATCH 3/3] Make webpack-manifest-plugin's version exact --- packages/react-scripts/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json index d534fb758c6..004ba9ee088 100644 --- a/packages/react-scripts/package.json +++ b/packages/react-scripts/package.json @@ -65,7 +65,7 @@ "url-loader": "0.5.7", "webpack": "1.13.2", "webpack-dev-server": "1.16.1", - "webpack-manifest-plugin": "^1.0.1", + "webpack-manifest-plugin": "1.0.1", "whatwg-fetch": "1.0.0" }, "devDependencies": {