Merge pull request #390 from BeAPI/fix/webpack-bundle-analyser

fix (bundle-report-analyser): make it work

Author: firestar300

config/plugins.js

@@ -8,6 +8,7 @@ const StyleLintPlugin = require('stylelint-webpack-plugin')
 const SpriteLoaderPlugin = require('svg-sprite-loader/plugin')
 const WebpackBar = require('webpackbar')
 const DependencyExtractionWebpackPlugin = require('@wordpress/dependency-extraction-webpack-plugin')
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
 
 const browsersyncConfig = require('./browsersync.config')
 
@@ -35,6 +36,12 @@ module.exports = {
     ]
 
     if (mode === 'production') {
+      plugins.push(
+        new BundleAnalyzerPlugin({
+          analyzerMode: 'json',
+          generateStatsFile: true,
+        })
+      )
       plugins.push(
         new WebpackManifestPlugin({
           fileName: 'assets.json',

package.json

@@ -12,7 +12,7 @@
     "lint:css": "node_modules/.bin/stylelint \"src/scss/**/*.scss\"",
     "lint:js": "node_modules/.bin/eslint \"src/js/**/*.js\"",
     "lint": "node_modules/.bin/concurrently \"yarn lint:css\" \"yarn lint:js\"",
-    "bundle-report": "yarn webpack --config config/webpack.prod.js --json=dist/stats.json && yarn webpack-bundle-analyzer dist/stats.json",
+    "bundle-report": "yarn build && yarn webpack-bundle-analyzer dist/stats.json",
     "image": "yarn node config/image-sizes.js"
   },
   "license": "GPL-2.0",

src/js/index.js

@@ -1,16 +1,6 @@
-import lazySizes from 'lazysizes'
-import 'lazysizes/plugins/native-loading/ls.native-loading'
-import 'lazysizes/plugins/object-fit/ls.object-fit'
+import 'lazysizes'
 import 'lazysizes/plugins/print/ls.print'
 import './classes/ScrollDirection'
 import './classes/ButtonSeoClick'
 import './classes/Header'
 import './classes/Animation'
-
-/**
- * LazySizes configuration
- * https://github.com/aFarkas/lazysizes/#js-api---options
- */
-lazySizes.cfg.nativeLoading = {
-  setLoadingAttribute: false,
-}