change webpack config to split vendor size below 4mb

.gitignore

@@ -15,5 +15,5 @@ npm-debug.log
 build
 
 # package zip
-beta.zip
-release.zip
+beta-*.zip
+release-*.zip

core/deploy.js

@@ -31,7 +31,7 @@ webStoreClient.fetchToken()
         .catch((err) => console.error(err))
     }
 
-    const file = fs.createReadStream(`./${mode}.zip`)
+    const file = fs.createReadStream(`./${mode}-chrome.zip`)
     console.log('Start upload.')
     try {
       const res = await webStoreClient.uploadExisting(file, token)

core/webpack.base.js

@@ -3,6 +3,7 @@ const webpack = require('webpack')
 const ChromeReloadPlugin = require('wcer')
 const { cssLoaders, htmlPage } = require('./tools')
 const CopyWebpackPlugin = require('copy-webpack-plugin')
+const CleanWebpackPlugin = require('clean-webpack-plugin')
 const GenerateLocaleJsonPlugin = require('../plugins/GenerateLocaleJsonPlugin')
 
 let resolve = (dir) => path.join(__dirname, '..', 'src', dir)
@@ -82,9 +83,10 @@ module.exports = (env) => {
       }]
     },
     plugins: [
-      htmlPage('Counter for Messenger', 'app', ['manifest', 'vendor', 'tab']),
-      htmlPage('options', 'options', ['manifest', 'vendor', 'options']),
-      htmlPage('background', 'background', ['manifest', 'vendor', 'background']),
+      new CleanWebpackPlugin([path.join('..', 'build', (env.FIREFOX) ? 'firefox' : 'chrome') + '/*.*'], { allowExternal: true }),
+      htmlPage('Counter for Messenger', 'app', ['vendor', 'element', 'chartjs', 'tab']),
+      htmlPage('options', 'options', ['vendor', 'element', 'chartjs', 'options']),
+      htmlPage('background', 'background', ['vendor', 'element', 'chartjs', 'background']),
       new webpack.DefinePlugin({
         chrome: (!env.FIREFOX) ? 'chrome' : 'browser',
         'process.env.FIREFOX': (env.FIREFOX) ? 'true' : 'false'
@@ -99,17 +101,18 @@ module.exports = (env) => {
       }),
       new webpack.optimize.CommonsChunkPlugin({
         name: 'vendor',
-        minChunks: function (module) {
-          return (
-            module.resource &&
-            /\.js$/.test(module.resource) &&
-            module.resource.indexOf(
-              path.join(__dirname, '../node_modules')
-            ) === 0
-          )
-        }
+        minChunks: (m) => /node_modules/.test(m.context)
+      }),
+      new webpack.optimize.CommonsChunkPlugin({
+        name: 'element',
+        minChunks: (m) => m.context.indexOf(path.join('node_modules', 'element-ui')) > -1 ||
+          m.context.indexOf(path.join('node_modules', 'chart.js')) > -1
+      }),
+      new webpack.optimize.CommonsChunkPlugin({
+        name: 'chartjs',
+        minChunks: (m) => m.context.indexOf(path.join('node_modules', 'chart.js')) > -1
       }),
-      new webpack.optimize.CommonsChunkPlugin({ name: 'manifest', chunks: ['vendor'] })
+      new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
     ],
     performance: { hints: false }
   }

core/webpack.beta.js

@@ -22,7 +22,7 @@ module.exports = (env) => {
       new OptimizeCSSPlugin({ cssProcessorOptions: { safe: true } }),
       new ExtractTextPlugin({ filename: 'css/[name].[contenthash].css' }),
       new webpack.HashedModuleIdsPlugin(),
-      new ZipPlugin({ path: '../..', filename: 'beta.zip' })
+      new ZipPlugin({ path: '../..', filename: (env.FIREFOX) ? 'beta-firefox.zip' : 'beta-chrome.zip' })
     ]
   })
 }

core/webpack.dev.js

@@ -2,17 +2,26 @@ const webpack = require('webpack')
 const merge = require('webpack-merge')
 const baseWebpack = require('./webpack.base')
 const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
 const { styleLoaders } = require('./tools')
 
+function genPlugins (isFirefox) {
+  const plugins = [
+    new webpack.NoEmitOnErrorsPlugin(),
+    new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"development"' }),
+    new FriendlyErrorsPlugin()
+  ]
+  if (!isFirefox) {
+    plugins.push(new BundleAnalyzerPlugin())
+  }
+  return plugins
+}
+
 module.exports = (env) =>
   merge(baseWebpack(env), {
     // cheap-module-eval-source-map быстрее для разработки
     watch: true,
     module: { rules: styleLoaders({ sourceMap: false }) },
     devtool: '#cheap-module-eval-source-map',
-    plugins: [
-      new webpack.NoEmitOnErrorsPlugin(),
-      new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"development"' }),
-      new FriendlyErrorsPlugin()
-    ]
+    plugins: genPlugins(env.FIREFOX)
   })

core/webpack.prod.js

@@ -1,7 +1,6 @@
 const webpack = require('webpack')
 const merge = require('webpack-merge')
 const baseWebpack = require('./webpack.base')
-const CleanWebpackPlugin = require('clean-webpack-plugin')
 const ExtractTextPlugin = require('extract-text-webpack-plugin')
 const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
 const ZipPlugin = require('zip-webpack-plugin')
@@ -12,12 +11,11 @@ module.exports = (env) =>
     devtool: '#cheap-module-eval-source-map',
     module: { rules: styleLoaders({ extract: true, sourceMap: true }) },
     plugins: [
-      new CleanWebpackPlugin(['build/*.*']),
       new webpack.NoEmitOnErrorsPlugin(),
       new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"production"' }),
       new OptimizeCSSPlugin({ cssProcessorOptions: { safe: true } }),
       new ExtractTextPlugin({ filename: 'css/[name].[contenthash].css' }),
       new webpack.HashedModuleIdsPlugin(),
-      new ZipPlugin({ path: '../..', filename: 'release.zip' })
+      new ZipPlugin({ path: '../..', filename: (env.FIREFOX) ? 'release-firefox.zip' : 'release-chrome.zip' })
     ]
   })

package.json

@@ -1,6 +1,6 @@
 {
   "name": "counter-for-messenger",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "Count and rank your friends by analysing your Messenger! Check out and download the messaging history of you and your best friends!",
   "author": "ALiangLiang <[email protected]>",
   "license": "MIT",
@@ -27,10 +27,10 @@
     "lint": "eslint --ext .js,.vue src",
     "dev": "webpack --config ./core/webpack.dev.js --hide-modules --env.CHROME",
     "dev-firefox": "webpack --config ./core/webpack.dev.js --hide-modules --env.FIREFOX",
-    "build": "webpack --config ./core/webpack.prod.js -p --progress --hide-modules --colors",
+    "build": "webpack --config ./core/webpack.prod.js -p --progress --hide-modules --colors --env.CHROME",
     "build-firefox": "webpack --config ./core/webpack.prod.js -p --progress --hide-modules --colors --env.FIREFOX",
     "beta-deploy": "webpack --config ./core/webpack.beta.js -p --progress --hide-modules --colors --env.BETA  && node core/deploy.js --beta",
-    "deploy": "webpack --config ./core/webpack.prod.js -p --progress --hide-modules --colors && node core/deploy.js"
+    "deploy": "webpack --config ./core/webpack.prod.js -p --progress --hide-modules --colors --env.CHROME && node core/deploy.js"
   },
   "devDependencies": {
     "archiver": "^2.1.0",
@@ -79,6 +79,7 @@
     "vue-template-compiler": "^2.5.2",
     "wcer": "^1.0.2",
     "webpack": "^3.8.1",
+    "webpack-bundle-analyzer": "^2.11.1",
     "webpack-dev-server": "^2.9.3",
     "webpack-merge": "^4.1.0",
     "ws": "^3.2.0",

src/manifest.js

@@ -2,7 +2,7 @@ const config = require('../core/.env')
 
 const manifest = {
   name: '__MSG_extName__',
-  version: '0.2.2.6',
+  version: '0.2.3',
   description: '__MSG_extDescription__',
   author: 'ALiangLiang',
   manifest_version: 2,
@@ -30,8 +30,9 @@ const manifest = {
   },
   content_scripts: [{
     js: [
-      'js/manifest.js',
       'js/vendor.js',
+      'js/element.js',
+      'js/chartjs.js',
       'js/content.js'
     ],
     matches: ['*://*.facebook.com/*'],

yarn.lock

@@ -138,6 +138,10 @@ acorn@^5.0.0, acorn@^5.2.1, acorn@^5.4.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.5.0.tgz#1abb587fbf051f94e3de20e6b26ef910b1828298"
 
+acorn@^5.3.0:
+  version "5.5.3"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.5.3.tgz#f473dd47e0277a08e28e9bec5aeeb04751f0b8c9"
+
 ajv-keywords@^2.1.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-2.1.1.tgz#617997fc5f60576894c435f940d819e135b80762"
@@ -1066,6 +1070,14 @@ bcrypt-pbkdf@^1.0.0:
   dependencies:
     tweetnacl "^0.14.3"
 
+bfj-node4@^5.2.0:
+  version "5.2.1"
+  resolved "https://registry.yarnpkg.com/bfj-node4/-/bfj-node4-5.2.1.tgz#3a6aa2730cf6911ba2afb836c2f88f015d718f3f"
+  dependencies:
+    bluebird "^3.5.1"
+    check-types "^7.3.0"
+    tryer "^1.0.0"
+
 big.js@^3.1.3:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e"
@@ -1477,6 +1489,10 @@ chartjs-color@^2.1.0:
     chartjs-color-string "^0.5.0"
     color-convert "^0.5.3"
 
+check-types@^7.3.0:
+  version "7.3.0"
+  resolved "https://registry.yarnpkg.com/check-types/-/check-types-7.3.0.tgz#468f571a4435c24248f5fd0cb0e8d87c3c341e7d"
+
 chokidar@^2.0.0, chokidar@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-2.0.2.tgz#4dc65139eeb2714977735b6a35d06e97b494dfd7"
@@ -1682,6 +1698,10 @@ [email protected]:
   dependencies:
     graceful-readlink ">= 1.0.0"
 
+commander@^2.13.0:
+  version "2.15.0"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-2.15.0.tgz#ad2a23a1c3b036e392469b8012cec6b33b4c1322"
+
 commander@~2.13.0:
   version "2.13.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.13.0.tgz#6964bca67685df7c1f1430c584f07d7597885b9c"
@@ -2344,7 +2364,7 @@ duplexer3@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/duplexer3/-/duplexer3-0.1.4.tgz#ee01dd1cac0ed3cbc7fdbea37dc0a8f1ce002ce2"
 
-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"
 
@@ -2367,6 +2387,10 @@ [email protected]:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
 
+ejs@^2.5.7:
+  version "2.5.7"
+  resolved "https://registry.yarnpkg.com/ejs/-/ejs-2.5.7.tgz#cc872c168880ae3c7189762fd5ffc00896c9518a"
+
 electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.30:
   version "1.3.34"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.34.tgz#d93498f40391bb0c16a603d8241b9951404157ed"
@@ -2982,6 +3006,10 @@ filename-regex@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/filename-regex/-/filename-regex-2.0.1.tgz#c1c4b9bee3e09725ddb106b75c1e301fe2f18b26"
 
+filesize@^3.5.11:
+  version "3.6.0"
+  resolved "https://registry.yarnpkg.com/filesize/-/filesize-3.6.0.tgz#22d079615624bb6fd3c04026120628a41b3f4efa"
+
 fill-range@^2.1.0:
   version "2.2.3"
   resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-2.2.3.tgz#50b77dfd7e469bc7492470963699fe7a8485a723"
@@ -3370,6 +3398,13 @@ graceful-fs@^4.1.0, graceful-fs@^4.1.11, graceful-fs@^4.1.2:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/graceful-readlink/-/graceful-readlink-1.0.1.tgz#4cafad76bc62f02fa039b2f94e9a3dd3a391a725"
 
+gzip-size@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-4.1.0.tgz#8ae096257eabe7d69c45be2b67c448124ffb517c"
+  dependencies:
+    duplexer "^0.1.1"
+    pify "^3.0.0"
+
 handle-thing@^1.2.5:
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-1.2.5.tgz#fd7aad726bf1a5fd16dfc29b2f7a6601d27139c4"
@@ -4984,6 +5019,10 @@ onetime@^2.0.0:
   dependencies:
     mimic-fn "^1.0.0"
 
+opener@^1.4.3:
+  version "1.4.3"
+  resolved "https://registry.yarnpkg.com/opener/-/opener-1.4.3.tgz#5c6da2c5d7e5831e8ffa3964950f8d6674ac90b8"
+
 opn@^5.1.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/opn/-/opn-5.2.0.tgz#71fdf934d6827d676cecbea1531f95d354641225"
@@ -6996,6 +7035,10 @@ trim-right@^1.0.1:
   dependencies:
     glob "^6.0.4"
 
+tryer@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/tryer/-/tryer-1.0.0.tgz#027b69fa823225e551cace3ef03b11f6ab37c1d7"
+
 [email protected]:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
@@ -7398,6 +7441,23 @@ wcer@^1.0.2:
     webpack-sources "^1.1.0"
     websocket-driver "^0.7.0"
 
+webpack-bundle-analyzer@^2.11.1:
+  version "2.11.1"
+  resolved "https://registry.yarnpkg.com/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.11.1.tgz#b9fbfb6a32c0a8c1c3237223e90890796b950ab9"
+  dependencies:
+    acorn "^5.3.0"
+    bfj-node4 "^5.2.0"
+    chalk "^2.3.0"
+    commander "^2.13.0"
+    ejs "^2.5.7"
+    express "^4.16.2"
+    filesize "^3.5.11"
+    gzip-size "^4.1.0"
+    lodash "^4.17.4"
+    mkdirp "^0.5.1"
+    opener "^1.4.3"
+    ws "^4.0.0"
+
 [email protected]:
   version "1.12.2"
   resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-1.12.2.tgz#f8fc1120ce3b4fc5680ceecb43d777966b21105e"
@@ -7604,6 +7664,13 @@ ws@^3.2.0:
     safe-buffer "~5.1.0"
     ultron "~1.1.0"
 
+ws@^4.0.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-4.1.0.tgz#a979b5d7d4da68bf54efe0408967c324869a7289"
+  dependencies:
+    async-limiter "~1.0.0"
+    safe-buffer "~5.1.0"
+
 xdg-basedir@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/xdg-basedir/-/xdg-basedir-3.0.0.tgz#496b2cc109eca8dbacfe2dc72b603c17c5870ad4"