|
@@ -1,14 +1,14 @@
|
|
|
-const fs = require('fs');
|
|
|
+const fs = require('fs')
|
|
|
const path = require('path')
|
|
|
const webpack = require('webpack')
|
|
|
const createThemeColorReplacerPlugin = require('./config/plugin.config')
|
|
|
// gzip 压缩
|
|
|
-const compressionWebpackPlugin = require('compression-webpack-plugin');
|
|
|
+const compressionWebpackPlugin = require('compression-webpack-plugin')
|
|
|
// js,css 压缩
|
|
|
-const TerserPlugin = require('terser-webpack-plugin');
|
|
|
+const TerserPlugin = require('terser-webpack-plugin')
|
|
|
// 版本自动生成
|
|
|
-const WebpackVersionPlugin = require('webpack-version-plugin');
|
|
|
-const versionConfig = require(resolve('public/version.json'));
|
|
|
+const WebpackVersionPlugin = require('webpack-version-plugin')
|
|
|
+const versionConfig = require(resolve('public/version.json'))
|
|
|
|
|
|
function resolve (dir) {
|
|
|
return path.join(__dirname, dir)
|
|
@@ -49,7 +49,7 @@ const prodExternals = {
|
|
|
vuex: 'Vuex',
|
|
|
axios: 'axios',
|
|
|
echarts: 'echarts',
|
|
|
- // lodash : {
|
|
|
+ // lodash : {
|
|
|
// commonjs: "lodash",
|
|
|
// amd: "lodash",
|
|
|
// root: "_" // indicates global variable
|
|
@@ -63,41 +63,41 @@ const vueConfig = {
|
|
|
publicPath: BASE_URL,
|
|
|
configureWebpack: {
|
|
|
optimization: isProd() ? {
|
|
|
- minimize: true,
|
|
|
- minimizer: [new TerserPlugin({
|
|
|
- test: /\.js(\?.*)?$/i, //匹配参与压缩的文件
|
|
|
- parallel: true, //使用多进程并发运行
|
|
|
- terserOptions: { //Terser 压缩配置
|
|
|
- output:{comments: false},
|
|
|
- compress: {//console删除
|
|
|
- pure_funcs: ["console.log"]
|
|
|
- }
|
|
|
- },
|
|
|
- extractComments: true, //将注释剥离到单独的文件中
|
|
|
- })],
|
|
|
- }:{},
|
|
|
+ minimize: true,
|
|
|
+ minimizer: [new TerserPlugin({
|
|
|
+ test: /\.js(\?.*)?$/i, // 匹配参与压缩的文件
|
|
|
+ parallel: true, // 使用多进程并发运行
|
|
|
+ terserOptions: { // Terser 压缩配置
|
|
|
+ output: { comments: false },
|
|
|
+ compress: {// console删除
|
|
|
+ pure_funcs: ['console.log']
|
|
|
+ }
|
|
|
+ },
|
|
|
+ extractComments: true // 将注释剥离到单独的文件中
|
|
|
+ })]
|
|
|
+ } : {},
|
|
|
// webpack plugins
|
|
|
plugins: [
|
|
|
// Ignore all locale files of moment.js
|
|
|
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
|
|
|
new compressionWebpackPlugin({
|
|
|
- //[file] 会被替换成原始资源。[path] 会被替换成原始资源的路径, [query] 会被替换成查询字符串。默认值是 "[path].gz[query]"。
|
|
|
- filename: '[path].gz[query]', // 提示compression-webpack-plugin@3.0.0的话asset改为filename
|
|
|
- //可以是 function(buf, callback) 或者字符串。对于字符串来说依照 zlib 的算法(或者 zopfli 的算法)。默认值是 "gzip"。
|
|
|
- algorithm: 'gzip',
|
|
|
- //所有匹配该正则的资源都会被处理。默认值是全部资源。
|
|
|
- test: new RegExp('\\.(' + ['js', 'css'].join('|') + ')$'),
|
|
|
- //只有大小大于该值的资源会被处理。单位是 bytes。默认值是 0。
|
|
|
- threshold: 10240,
|
|
|
- //只有压缩率小于这个值的资源才会被处理。默认值是 0.8。
|
|
|
- minRatio: 0.8
|
|
|
- }),
|
|
|
+ // [file] 会被替换成原始资源。[path] 会被替换成原始资源的路径, [query] 会被替换成查询字符串。默认值是 "[path].gz[query]"。
|
|
|
+ filename: '[path].gz[query]', // 提示compression-webpack-plugin@3.0.0的话asset改为filename
|
|
|
+ // 可以是 function(buf, callback) 或者字符串。对于字符串来说依照 zlib 的算法(或者 zopfli 的算法)。默认值是 "gzip"。
|
|
|
+ algorithm: 'gzip',
|
|
|
+ // 所有匹配该正则的资源都会被处理。默认值是全部资源。
|
|
|
+ test: new RegExp('\\.(' + ['js', 'css'].join('|') + ')$'),
|
|
|
+ // 只有大小大于该值的资源会被处理。单位是 bytes。默认值是 0。
|
|
|
+ threshold: 10240,
|
|
|
+ // 只有压缩率小于这个值的资源才会被处理。默认值是 0.8。
|
|
|
+ minRatio: 0.8
|
|
|
+ }),
|
|
|
new WebpackVersionPlugin({
|
|
|
// You must set the cb option
|
|
|
- cb: function(hashMap) {
|
|
|
- if(!isProd()){
|
|
|
- versionConfig.version = new Date().getTime();
|
|
|
- fs.writeFileSync(resolve('./public/version.json'), JSON.stringify(versionConfig, null, 2));
|
|
|
+ cb: function (hashMap) {
|
|
|
+ if (!isProd()) {
|
|
|
+ versionConfig.version = new Date().getTime()
|
|
|
+ fs.writeFileSync(resolve('./public/version.json'), JSON.stringify(versionConfig, null, 2))
|
|
|
}
|
|
|
}
|
|
|
})
|
|
@@ -133,18 +133,18 @@ const vueConfig = {
|
|
|
return args
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
config.optimization && config.optimization.splitChunks({
|
|
|
- // 拆包配置
|
|
|
- chunks: 'all', //三选一:"initial" 初始化,"all"(默认就是all),"async"(动态加载)
|
|
|
- minSize: 30000, // 形成一个新代码块最小的体积,只有 >= minSize 的bundle会被拆分出来 30000
|
|
|
- maxSize: 0, //拆分之前最大的数值,默认为0,即不做限制
|
|
|
- minChunks: 1, //引入次数,如果为2 那么一个资源最少被引用两次才可以被拆分出来
|
|
|
- maxAsyncRequests: 5, // 按需加载的最大并行请求数
|
|
|
- maxInitialRequests: 4, // 一个入口最大并行请求数
|
|
|
- automaticNameDelimiter: '~', // 文件名的连接符
|
|
|
- name: true,
|
|
|
- cacheGroups: {
|
|
|
+ // 拆包配置
|
|
|
+ chunks: 'all', // 三选一:"initial" 初始化,"all"(默认就是all),"async"(动态加载)
|
|
|
+ minSize: 30000, // 形成一个新代码块最小的体积,只有 >= minSize 的bundle会被拆分出来 30000
|
|
|
+ maxSize: 0, // 拆分之前最大的数值,默认为0,即不做限制
|
|
|
+ minChunks: 1, // 引入次数,如果为2 那么一个资源最少被引用两次才可以被拆分出来
|
|
|
+ maxAsyncRequests: 5, // 按需加载的最大并行请求数
|
|
|
+ maxInitialRequests: 4, // 一个入口最大并行请求数
|
|
|
+ automaticNameDelimiter: '~', // 文件名的连接符
|
|
|
+ name: true,
|
|
|
+ cacheGroups: {
|
|
|
// node_modules模块包
|
|
|
vendors: {
|
|
|
test: /[\\/]node_modules[\\/]/,
|
|
@@ -154,7 +154,7 @@ const vueConfig = {
|
|
|
// return `chunk.${packageName.replace('@', '')}`;
|
|
|
// },
|
|
|
chunks: 'all',
|
|
|
- priority: -10,
|
|
|
+ priority: -10
|
|
|
},
|
|
|
// UI库单独拆包
|
|
|
antDesign: {
|
|
@@ -171,18 +171,18 @@ const vueConfig = {
|
|
|
common: {
|
|
|
name: 'chunk-common',
|
|
|
minChunks: 2,
|
|
|
- maxSize: 1024, //拆分之前最大的数值,默认为0,即不做限制
|
|
|
+ maxSize: 1024, // 拆分之前最大的数值,默认为0,即不做限制
|
|
|
priority: -20,
|
|
|
reuseExistingChunk: true
|
|
|
}
|
|
|
- }
|
|
|
- });
|
|
|
-
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
// 分析打包大小
|
|
|
if (process.env.npm_config_report) {
|
|
|
config.plugin('webpack-bundle-analyzer')
|
|
|
- .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
|
|
|
- .end();
|
|
|
+ .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
|
|
|
+ .end()
|
|
|
}
|
|
|
},
|
|
|
|
|
@@ -220,7 +220,7 @@ const vueConfig = {
|
|
|
}
|
|
|
},
|
|
|
watchOptions: {
|
|
|
- ignored: [/node_modules/, /public/],
|
|
|
+ ignored: [/node_modules/, /public/]
|
|
|
}
|
|
|
},
|
|
|
|
|
@@ -239,4 +239,4 @@ if (process.env.VUE_APP_PREVIEW === 'true') {
|
|
|
vueConfig.configureWebpack.plugins.push(createThemeColorReplacerPlugin())
|
|
|
}
|
|
|
|
|
|
-module.exports = vueConfig
|
|
|
+module.exports = vueConfig
|