From c067e78a8b3439a7d5452d855255b263268e7c6a Mon Sep 17 00:00:00 2001 From: FairyEver <1711467488@qq.com> Date: Thu, 12 Dec 2019 21:04:00 +0800 Subject: [PATCH] =?UTF-8?q?=E9=87=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .eslintrc.js | 4 +-- package-lock.json | 52 ++++++++++++++++++++++++--- package.json | 2 ++ vue.config.js | 89 +++++++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 140 insertions(+), 7 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 98d04316..343a7d43 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -8,8 +8,8 @@ module.exports = { '@vue/standard' ], rules: { - 'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off', - 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off' + 'no-console': 'off', + 'no-debugger': 'off' }, parserOptions: { parser: 'babel-eslint' diff --git a/package-lock.json b/package-lock.json index 975a87cb..c2732d55 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10869,6 +10869,16 @@ "integrity": "sha512-77XF9iTllATmG9lSlIv0qdQ2BQ/h9t0bJllHlbvsQ0zUWfU7Yi0S8L5JXzPZgkefIiajLmBJJ4BsMJmqcf7oxQ==", "dev": true }, + "last-call-webpack-plugin": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz", + "integrity": "sha512-7KI2l2GIZa9p2spzPIVZBYyNKkN+e/SQPpnjlTiPhdbDW3F86tdKKELxKpzJ5sgU19wQWsACULZmpTPYHeWO5w==", + "dev": true, + "requires": { + "lodash": "^4.17.5", + "webpack-sources": "^1.1.0" + } + }, "launch-editor": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.2.1.tgz", @@ -12070,6 +12080,16 @@ } } }, + "optimize-css-assets-webpack-plugin": { + "version": "5.0.3", + "resolved": "https://registry.npmjs.org/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-5.0.3.tgz", + "integrity": "sha512-q9fbvCRS6EYtUKKSwI87qm2IxlyJK5b4dygW1rKUBT6mMDhdG5e5bZT63v6tnJR9F9FB/H5a0HTmtw+laUBxKA==", + "dev": true, + "requires": { + "cssnano": "^4.1.10", + "last-call-webpack-plugin": "^3.0.0" + } + }, "optionator": { "version": "0.8.3", "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.3.tgz", @@ -15843,7 +15863,6 @@ "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.6.9.tgz", "integrity": "sha512-pcnnhaoG6RtrvHJ1dFncAe8Od6Nuy30oaJ82ts6//sGSXOP5UjBMEthiProjXmMNHOfd93sqlkztifFMcb+4yw==", "dev": true, - "optional": true, "requires": { "commander": "~2.20.3", "source-map": "~0.6.1" @@ -15853,15 +15872,38 @@ "version": "2.20.3", "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz", "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==", - "dev": true, - "optional": true + "dev": true }, "source-map": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", - "dev": true, - "optional": true + "dev": true + } + } + }, + "uglifyjs-webpack-plugin": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-2.2.0.tgz", + "integrity": "sha512-mHSkufBmBuJ+KHQhv5H0MXijtsoA1lynJt1lXOaotja8/I0pR4L9oGaPIZw+bQBOFittXZg9OC1sXSGO9D9ZYg==", + "dev": true, + "requires": { + "cacache": "^12.0.2", + "find-cache-dir": "^2.1.0", + "is-wsl": "^1.1.0", + "schema-utils": "^1.0.0", + "serialize-javascript": "^1.7.0", + "source-map": "^0.6.1", + "uglify-js": "^3.6.0", + "webpack-sources": "^1.4.0", + "worker-farm": "^1.7.0" + }, + "dependencies": { + "source-map": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", + "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "dev": true } } }, diff --git a/package.json b/package.json index bcd7eecb..a66252c0 100644 --- a/package.json +++ b/package.json @@ -64,10 +64,12 @@ "compression-webpack-plugin": "^3.0.1", "eslint": "^5.16.0", "eslint-plugin-vue": "^5.2.2", + "optimize-css-assets-webpack-plugin": "^5.0.3", "sass": "^1.21.0", "sass-loader": "^7.1.0", "svg-sprite-loader": "^4.1.6", "text-loader": "0.0.1", + "uglifyjs-webpack-plugin": "^2.2.0", "vue-cli-plugin-i18n": "^0.6.0", "vue-template-compiler": "^2.6.10", "webpack-theme-color-replacer": "^1.2.15" diff --git a/vue.config.js b/vue.config.js index e28e1592..c8425209 100644 --- a/vue.config.js +++ b/vue.config.js @@ -1,5 +1,8 @@ const CompressionWebpackPlugin = require('compression-webpack-plugin') +const UglifyJsPlugin = require('uglifyjs-webpack-plugin') +const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin') + const VueFilenameInjector = require('@d2-projects/vue-filename-injector') const ThemeColorReplacer = require('webpack-theme-color-replacer') @@ -31,6 +34,92 @@ module.exports = { } }, configureWebpack: { + externals: { + 'vue': 'Vue', + 'vue-router': 'VueRouter', + 'vuex': 'Vuex' + }, + // 关闭文件过大提示，利于打包加快速度 + performance: { + hints: 'warning', + // 入口起点的最大体积 + maxEntrypointSize: 50000000, + // 生成文件的最大体积 + maxAssetSize: 30000000, + // 只给出 js 文件的性能提示 + assetFilter: function(assetFilename) { + return assetFilename.endsWith('.js'); + } + }, + // 公共代码抽离和代码分割 + optimization: { + runtimeChunk: 'single', + splitChunks: { + cacheGroups: { + vendors: { + test: /[\\/]node_modules[\\/]/, + name: 'vendors', + minSize: 30000, + minChunks: 1, + chunks: 'initial', + priority: 1 // 设置处理的优先级，数值越大越优先处理 + }, + commons: { + test: /[\\/]src[\\/]common[\\/]/, + name: 'commons', + minSize: 30000, + minChunks: 3, + chunks: 'initial', + priority: -1, + reuseExistingChunk: true // 允许使用已经存在的代码块 + }, + styles: { + name: 'styles', + test: /\.(sa|sc|c)ss$/, + chunks: 'all', + enforce: true + }, + runtimeChunk: { + name: 'manifest' + } + } + }, + minimizer: [ + // 自定义js优化配置，将会覆盖默认配置 + new UglifyJsPlugin({ + exclude: /\.min\.js$/, // 过滤掉以 '.min.js' 结尾的文件，我们认为这个后缀本身就是已经压缩好的代码，没必要进行二次压缩 + cache: true, + parallel: true, // 开启并行压缩，充分利用cpu + sourceMap: false, + extractComments: false, // 移除注释 + uglifyOptions: { + compress: { + unused: true, + drop_console: true, + drop_debugger: true, + pure_funcs: ['console.log'] + }, + output: { + comments: false + }, + warnings: false + } + }), + // 用于优化css文件 + new OptimizeCssAssetsPlugin({ + assetNameRegExp: /\.css$/g, + cssProcessorOptions: { + safe: true, + autoprefixer: { disable: true }, + mergeLonghand: false, + discardComments: { + removeAll: true // 移除注释 + } + }, + canPrint: true + }) + ] + }, plugins: [ // gzip new CompressionWebpackPlugin({