commit 048a5e910053b1487fe9fa25ed1cde09be99ee20
parent 097c1a3bcbd8731e3fa9817dcdf6fcc7fe27620e
Author: Pavel Lang <langpavel@phpskelet.org>
Date: Thu, 16 Feb 2017 04:27:48 +0100
Merge pull request #1134 from langpavel/webpack-bundle-analyzer
Webpack bundle analyzer
* New --analyse flag for webpack
* New task build:analyse — alias for yarn run build -- --release --analyse
Diffstat:
5 files changed, 80 insertions(+), 57 deletions(-)
diff --git a/.gitignore b/.gitignore
@@ -7,3 +7,4 @@ node_modules
ncp-debug.log
npm-debug.log
stats.json
+report.html
diff --git a/package.json b/package.json
@@ -109,6 +109,7 @@
"stylelint-config-standard": "^16.0.0",
"url-loader": "^0.5.7",
"webpack": "^2.2.1",
+ "webpack-bundle-analyzer": "^2.3.0",
"webpack-dev-middleware": "^1.10.0",
"webpack-hot-middleware": "^2.16.1",
"write-file-webpack-plugin": "^3.4.2"
@@ -205,10 +206,10 @@
"copy": "babel-node tools/run copy",
"bundle": "babel-node tools/run bundle",
"build": "babel-node tools/run build",
+ "build:stats": "yarn run build -- --release --analyse",
"deploy": "babel-node tools/run deploy",
"render": "babel-node tools/run render",
"serve": "babel-node tools/run runServer",
- "start": "babel-node tools/run start",
- "stats": "babel-node tools/run stats"
+ "start": "babel-node tools/run start"
}
}
diff --git a/tools/stats.js b/tools/stats.js
@@ -1,53 +0,0 @@
-/**
- * React Starter Kit (https://www.reactstarterkit.com/)
- *
- * Copyright © 2014-present Kriasoft, LLC. All rights reserved.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.txt file in the root directory of this source tree.
- */
-
-import webpack from 'webpack';
-import { writeFile } from 'fs';
-import { open } from 'openurl';
-import webpackConfig from './webpack.config';
-
-const isDebug = !process.argv.includes('--release');
-const WEBPACK_ANALYSER_URL = 'http://webpack.github.io/analyse/';
-
-if (isDebug) {
- console.log('INFO: You should run `yarn stats -- --release` if you want production stats');
-}
-
-/**
- * Creates application stats for client bundle.
- */
-function clientStats() {
- return new Promise((resolve, reject) => {
- const clientConfig = {
- ...webpackConfig[0],
- profile: true,
- };
-
- webpack(clientConfig).run((err, stats) => {
- if (err) {
- reject(err);
- return;
- }
-
- const statsJson = JSON.stringify(stats.toJson(), null, 2);
- writeFile('stats.json', statsJson, 'utf-8', (saveErr) => {
- if (saveErr) {
- console.error(saveErr.message);
- reject(saveErr);
- return;
- }
- console.log(`Now you can load \`stats.json\` into page at ${WEBPACK_ANALYSER_URL}`);
- open(WEBPACK_ANALYSER_URL);
- resolve(stats);
- });
- });
- });
-}
-
-export default clientStats;
diff --git a/tools/webpack.config.js b/tools/webpack.config.js
@@ -10,10 +10,26 @@
import path from 'path';
import webpack from 'webpack';
import AssetsPlugin from 'assets-webpack-plugin';
+import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
import pkg from '../package.json';
const isDebug = !process.argv.includes('--release');
const isVerbose = process.argv.includes('--verbose');
+const isAnalyse = process.argv.includes('--analyse') || process.argv.includes('--analyze');
+const port = parseInt(process.env.PORT || '3000', 10);
+const analyzerPort = port + 3;
+
+// Can be `server`, `static` or `disabled`.
+// In `server` mode analyzer will start HTTP server to show bundle report.
+// In `static` mode single HTML file with bundle report will be generated.
+// In `disabled` mode you can use this plugin to just generate Webpack Stats JSON
+// file by setting `generateStatsFile` to `true`.
+let analyzerMode = 'disabled';
+if (isAnalyse) {
+ analyzerMode = 'server';
+} else if (!isDebug) {
+ analyzerMode = 'static';
+}
//
// Common configuration chunk to be used for both
@@ -216,6 +232,31 @@ const clientConfig = {
},
}),
],
+
+ new BundleAnalyzerPlugin({
+ // See above
+ analyzerMode,
+ // Host that will be used in `server` mode to start HTTP server.
+ analyzerHost: '127.0.0.1',
+ // Port that will be used in `server` mode to start HTTP server.
+ analyzerPort,
+ // Path to bundle report file that will be generated in `static` mode.
+ // Relative to bundles output directory.
+ reportFilename: path.resolve(__dirname, '../report.html'),
+ // Automatically open report in default browser
+ openAnalyzer: true,
+ // If `true`, Webpack Stats JSON file will be generated in bundles output directory
+ generateStatsFile: !isDebug,
+ // Name of Webpack Stats JSON file that will be generated if `generateStatsFile` is `true`.
+ // Relative to bundles output directory.
+ statsFilename: path.resolve(__dirname, '../stats.json'),
+ // Options for `stats.toJson()` method.
+ // You can exclude sources of your modules from stats file with `source: false` option.
+ // See more options here: https://github.com/webpack/webpack/blob/webpack-1/lib/Stats.js#L21
+ statsOptions: null,
+ // Log level. Can be 'info', 'warn', 'error' or 'silent'.
+ logLevel: 'info',
+ }),
],
// Choose a developer tool to enhance debugging
diff --git a/yarn.lock b/yarn.lock
@@ -46,6 +46,10 @@ acorn@^3.0.4, acorn@^3.1.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/acorn/-/acorn-3.3.0.tgz#45e37fb39e8da3f25baee3ff5369e2bb5f22017a"
+acorn@^4.0.11:
+ version "4.0.11"
+ resolved "https://registry.yarnpkg.com/acorn/-/acorn-4.0.11.tgz#edcda3bd937e7556410d42ed5860f67399c794c0"
+
acorn@^4.0.3, acorn@^4.0.4:
version "4.0.10"
resolved "https://registry.yarnpkg.com/acorn/-/acorn-4.0.10.tgz#598ed8bdd4de8b5a7a7fa2f6d2188ebbf9b1f12c"
@@ -2110,7 +2114,7 @@ duplexer2@0.0.2:
dependencies:
readable-stream "~1.1.9"
-duplexer@~0.1.1:
+duplexer@^0.1.1, duplexer@~0.1.1:
version "0.1.1"
resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.1.tgz#ace6ff808c1ce66b57d1ebf97977acb02334cfc1"
@@ -2174,6 +2178,10 @@ ee-first@1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
+ejs@^2.5.5:
+ version "2.5.5"
+ resolved "https://registry.yarnpkg.com/ejs/-/ejs-2.5.5.tgz#6ef4e954ea7dcf54f66aad2fe7aa421932d9ed77"
+
electron-to-chromium@^1.2.1:
version "1.2.2"
resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.2.2.tgz#e41bc9488c88e3cfa1e94bde28e8420d7d47c47c"
@@ -2714,7 +2722,7 @@ filename-regex@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/filename-regex/-/filename-regex-2.0.0.tgz#996e3e80479b98b9897f15a8a58b3d084e926775"
-filesize@^3.2.1:
+filesize@^3.2.1, filesize@^3.5.4:
version "3.5.4"
resolved "https://registry.yarnpkg.com/filesize/-/filesize-3.5.4.tgz#742fc7fb6aef4ee3878682600c22f840731e1fda"
@@ -3050,6 +3058,12 @@ growl@1.9.2:
version "1.9.2"
resolved "https://registry.yarnpkg.com/growl/-/growl-1.9.2.tgz#0ea7743715db8d8de2c5ede1775e1b45ac85c02f"
+gzip-size@^3.0.0:
+ version "3.0.0"
+ resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-3.0.0.tgz#546188e9bdc337f673772f81660464b389dce520"
+ dependencies:
+ duplexer "^0.1.1"
+
handlebars@^1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-1.3.0.tgz#9e9b130a93e389491322d975cf3ec1818c37ce34"
@@ -4557,6 +4571,10 @@ onetime@^1.0.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/onetime/-/onetime-1.1.0.tgz#a1f7838f8314c516f05ecefcbc4ccfe04b4ed789"
+opener@^1.4.2:
+ version "1.4.3"
+ resolved "https://registry.yarnpkg.com/opener/-/opener-1.4.3.tgz#5c6da2c5d7e5831e8ffa3964950f8d6674ac90b8"
+
openurl@1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/openurl/-/openurl-1.1.0.tgz#e2f2189d999c04823201f083f0f1a7cd8903187a"
@@ -6718,6 +6736,21 @@ watchpack@^1.2.0:
chokidar "^1.4.3"
graceful-fs "^4.1.2"
+webpack-bundle-analyzer@^2.3.0:
+ version "2.3.0"
+ resolved "https://registry.yarnpkg.com/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.3.0.tgz#0d05e96a43033f7cc57f6855b725782ba61e93a4"
+ dependencies:
+ acorn "^4.0.11"
+ chalk "^1.1.3"
+ commander "^2.9.0"
+ ejs "^2.5.5"
+ express "^4.14.1"
+ filesize "^3.5.4"
+ gzip-size "^3.0.0"
+ lodash "^4.17.4"
+ mkdirp "^0.5.1"
+ opener "^1.4.2"
+
webpack-dev-middleware@^1.10.0:
version "1.10.0"
resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-1.10.0.tgz#7d5be2651e692fddfafd8aaed177c16ff51f0eb8"
