introduce bundle analyzer plugin in production build (vuejs-templates…

…#437)
lbensaad · Feb 3, 2017 · 2e6fe33 · 2e6fe33
1 parent 6adb694
commit 2e6fe33
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 1 deletion.
diff --git a/template/README.md b/template/README.md
@@ -13,6 +13,9 @@ npm run dev
 
 # build for production with minification
 npm run build
+
+# build for production and view the bundle analyzer report
+npm run build --report
 {{#unit}}
 
 # run unit tests

diff --git a/template/build/webpack.prod.conf.js b/template/build/webpack.prod.conf.js
@@ -95,4 +95,9 @@ if (config.build.productionGzip) {
   )
 }
 
+if (config.build.bundleAnalyzerReport) {
+  var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
+  webpackConfig.plugins.push(new BundleAnalyzerPlugin())
+}
+
 module.exports = webpackConfig
diff --git a/template/config/index.js b/template/config/index.js
@@ -14,7 +14,12 @@ module.exports = {
     // Before setting to `true`, make sure to:
     // npm install --save-dev compression-webpack-plugin
     productionGzip: false,
-    productionGzipExtensions: ['js', 'css']
+    productionGzipExtensions: ['js', 'css'],
+    // Run the build command with an extra argument to
+    // View the bundle analyzer report after build finishes:
+    // `npm run build --report`
+    // Set to `true` or `false` to always turn it on or off
+    bundleAnalyzerReport: process.env.npm_config_report
   },
   dev: {
     env: require('./dev.env'),

diff --git a/template/package.json b/template/package.json
@@ -55,6 +55,7 @@
     "html-webpack-plugin": "^2.28.0",
     "http-proxy-middleware": "^0.17.3",
     "json-loader": "^0.5.4",
+    "webpack-bundle-analyzer": "^2.2.1",
     {{#unit}}
     "cross-env": "^3.1.4",
     "karma": "^1.4.1",