add webpack:analyze command

Author: jchavarri

README.md

@@ -41,4 +41,4 @@ Then open http://localhost:8000 to see your app.
 
 # Acknowledgements
 
-This projects was adapted from https://github.com/jihchi/rescript-react-realworld-example-app by [@jihchi](https://github.com/jihchi).
+This project was adapted from https://github.com/jihchi/rescript-react-realworld-example-app by [@jihchi](https://github.com/jihchi).

package.json

@@ -12,14 +12,15 @@
   "scripts": {
     "webpack": "webpack -w",
     "webpack:production": "webpack --mode=production",
+    "webpack:analyze": "ANALYZE=true webpack --mode=production",
     "server": "webpack-dev-server",
     "analyze": "webpack --mode=production --profile --json > stats.json && webpack-bundle-analyzer stats.json",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "devDependencies": {
     "html-webpack-plugin": "^3.2.0",
     "webpack": "^4.44.2",
-    "webpack-bundle-analyzer": "^3.9.0",
+    "webpack-bundle-analyzer": "^4.5.0",
     "webpack-cli": "^3.3.12",
     "webpack-dev-server": "^3.11.0"
   },

webpack.config.js

@@ -1,8 +1,10 @@
 const path = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 const outputDir = path.join(__dirname, 'build/');
 
 const isProd = process.env.NODE_ENV === 'production';
+const withAnalyzer = process.env.ANALYZE == "true";
 
 module.exports = {
   entry: './_build/default/src/main.bc.js',
@@ -23,7 +25,10 @@ module.exports = {
       template: 'src/index.html',
       inject: false,
       favicon: "./src/favicon.ico"
-    })
+    }),
+    ...(withAnalyzer ? [new BundleAnalyzerPlugin({
+      analyzerMode: "static",
+    })] : [])
   ],
   devServer: {
     compress: true,