|
@@ -2,11 +2,11 @@ const fs = require('fs');
|
|
const path = require('path')
|
|
const path = require('path')
|
|
const webpack = require('webpack')
|
|
const webpack = require('webpack')
|
|
const createThemeColorReplacerPlugin = require('./config/plugin.config')
|
|
const createThemeColorReplacerPlugin = require('./config/plugin.config')
|
|
-// gzip 压缩
|
|
|
|
|
|
+// gzip 压锟斤拷
|
|
const compressionWebpackPlugin = require('compression-webpack-plugin');
|
|
const compressionWebpackPlugin = require('compression-webpack-plugin');
|
|
-// js,css 压缩
|
|
|
|
|
|
+// js,css 压锟斤拷
|
|
const TerserPlugin = require('terser-webpack-plugin');
|
|
const TerserPlugin = require('terser-webpack-plugin');
|
|
-// 版本自动生成
|
|
|
|
|
|
+// 锟芥本锟皆讹拷锟斤拷锟斤拷
|
|
const WebpackVersionPlugin = require('webpack-version-plugin');
|
|
const WebpackVersionPlugin = require('webpack-version-plugin');
|
|
const versionConfig = require(resolve('public/version.json'));
|
|
const versionConfig = require(resolve('public/version.json'));
|
|
|
|
|
|
@@ -22,13 +22,13 @@ function isProd () {
|
|
return process.env.NODE_ENV === 'production'
|
|
return process.env.NODE_ENV === 'production'
|
|
}
|
|
}
|
|
|
|
|
|
-// 项目部署基础
|
|
|
|
-// 默认情况下,我们假设你的应用将被部署在域的根目录下,
|
|
|
|
-// 例如:https://www.my-app.com/
|
|
|
|
-// 默认:'/'
|
|
|
|
-// 如果您的应用程序部署在子路径中,则需要在这指定子路径
|
|
|
|
-// 例如:https://www.foobar.com/my-app/
|
|
|
|
-// 需要将它改为'/my-app/'
|
|
|
|
|
|
+// 锟斤拷目锟斤拷锟斤拷锟斤拷锟�
|
|
|
|
+// 默锟斤拷锟斤拷锟斤拷拢锟斤拷锟斤拷羌锟斤拷锟斤拷锟斤拷应锟矫斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷母锟侥柯硷拷锟�,
|
|
|
|
+// 锟斤拷锟界:https://www.my-app.com/
|
|
|
|
+// 默锟较o拷'/'
|
|
|
|
+// 锟斤拷锟斤拷锟斤拷锟接︼拷贸锟斤拷锟斤拷锟斤拷锟斤拷锟铰凤拷锟斤拷校锟斤拷锟斤拷锟揭�拷锟斤拷锟街革拷锟斤拷锟铰凤拷锟�
|
|
|
|
+// 锟斤拷锟界:https://www.foobar.com/my-app/
|
|
|
|
+// 锟斤拷要锟斤拷锟斤拷锟斤拷为'/my-app/'
|
|
const BASE_URL = isProd ? '/' : '/'
|
|
const BASE_URL = isProd ? '/' : '/'
|
|
|
|
|
|
const assetsCDN = {
|
|
const assetsCDN = {
|
|
@@ -61,21 +61,21 @@ const prodExternals = {
|
|
|
|
|
|
// vue.config.js
|
|
// vue.config.js
|
|
const vueConfig = {
|
|
const vueConfig = {
|
|
- runtimeCompiler: true, // 动态编译组件
|
|
|
|
|
|
+ runtimeCompiler: true, // 锟斤拷态锟斤拷锟斤拷锟斤拷锟�
|
|
publicPath: BASE_URL,
|
|
publicPath: BASE_URL,
|
|
configureWebpack: {
|
|
configureWebpack: {
|
|
optimization: isProd() ? {
|
|
optimization: isProd() ? {
|
|
minimize: true,
|
|
minimize: true,
|
|
minimizer: [new TerserPlugin({
|
|
minimizer: [new TerserPlugin({
|
|
- test: /\.js(\?.*)?$/i, //匹配参与压缩的文件
|
|
|
|
- parallel: true, //使用多进程并发运行
|
|
|
|
- terserOptions: { //Terser 压缩配置
|
|
|
|
|
|
+ test: /\.js(\?.*)?$/i, //匹锟斤拷锟斤拷锟窖癸拷锟斤拷锟斤拷募锟�
|
|
|
|
+ parallel: true, //使锟矫讹拷锟斤拷滩锟斤拷锟斤拷锟斤拷锟�
|
|
|
|
+ terserOptions: { //Terser 压锟斤拷锟斤拷锟斤拷
|
|
output:{comments: false},
|
|
output:{comments: false},
|
|
- compress: {//console删除
|
|
|
|
|
|
+ compress: {//console删锟斤拷
|
|
pure_funcs: ["console.log"]
|
|
pure_funcs: ["console.log"]
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- extractComments: true, //将注释剥离到单独的文件中
|
|
|
|
|
|
+ extractComments: true, //锟斤拷注锟酵帮拷锟诫到锟斤拷锟斤拷锟斤拷锟侥硷拷锟斤拷
|
|
})],
|
|
})],
|
|
}:{},
|
|
}:{},
|
|
// webpack plugins
|
|
// webpack plugins
|
|
@@ -83,15 +83,15 @@ const vueConfig = {
|
|
// Ignore all locale files of moment.js
|
|
// Ignore all locale files of moment.js
|
|
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
|
|
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
|
|
new compressionWebpackPlugin({
|
|
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"。
|
|
|
|
|
|
+ //[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',
|
|
algorithm: 'gzip',
|
|
- //所有匹配该正则的资源都会被处理。默认值是全部资源。
|
|
|
|
|
|
+ //锟斤拷锟斤拷匹锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷源锟斤拷锟结被锟斤拷锟斤拷锟斤拷默锟斤拷值锟斤拷全锟斤拷锟斤拷源锟斤拷
|
|
test: new RegExp('\\.(' + ['js', 'css'].join('|') + ')$'),
|
|
test: new RegExp('\\.(' + ['js', 'css'].join('|') + ')$'),
|
|
- //只有大小大于该值的资源会被处理。单位是 bytes。默认值是 0。
|
|
|
|
|
|
+ //只锟叫达拷小锟斤拷锟节革拷值锟斤拷锟斤拷源锟结被锟斤拷锟斤拷锟斤拷锟斤拷位锟斤拷 bytes锟斤拷默锟斤拷值锟斤拷 0锟斤拷
|
|
threshold: 10240,
|
|
threshold: 10240,
|
|
- //只有压缩率小于这个值的资源才会被处理。默认值是 0.8。
|
|
|
|
|
|
+ //只锟斤拷压锟斤拷锟斤拷小锟斤拷锟斤拷锟街碉拷锟斤拷锟皆达拷呕岜伙拷锟斤拷锟斤拷锟侥�拷锟街碉拷锟� 0.8锟斤拷
|
|
minRatio: 0.8
|
|
minRatio: 0.8
|
|
}),
|
|
}),
|
|
new WebpackVersionPlugin({
|
|
new WebpackVersionPlugin({
|
|
@@ -137,17 +137,17 @@ const vueConfig = {
|
|
}
|
|
}
|
|
|
|
|
|
config.optimization && config.optimization.splitChunks({
|
|
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: '~', // 文件名的连接符
|
|
|
|
|
|
+ // 锟斤拷锟斤拷锟斤拷锟�
|
|
|
|
+ chunks: 'all', //锟斤拷选一锟斤拷"initial" 锟斤拷始锟斤拷锟斤拷"all"(默锟较撅拷锟斤拷all)锟斤拷"async"锟斤拷锟斤拷态锟斤拷锟截o拷
|
|
|
|
+ minSize: 30000, // 锟轿筹拷一锟斤拷锟铰达拷锟斤拷锟斤拷锟叫★拷锟斤拷锟斤拷,只锟斤拷 >= minSize 锟斤拷bundle锟结被锟斤拷殖锟斤拷锟� 30000
|
|
|
|
+ maxSize: 0, //锟斤拷锟街�帮拷锟斤拷锟斤拷锟街碉拷锟侥�拷锟轿�0锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷
|
|
|
|
+ minChunks: 1, //锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷为2 锟斤拷么一锟斤拷锟斤拷源锟斤拷锟劫憋拷锟斤拷锟斤拷锟斤拷锟轿才匡拷锟皆憋拷锟斤拷殖锟斤拷锟�
|
|
|
|
+ maxAsyncRequests: 5, // 锟斤拷锟斤拷锟斤拷氐锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷
|
|
|
|
+ maxInitialRequests: 4, // 一锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷
|
|
|
|
+ automaticNameDelimiter: '~', // 锟侥硷拷锟斤拷锟斤拷锟斤拷锟接凤拷
|
|
name: true,
|
|
name: true,
|
|
cacheGroups: {
|
|
cacheGroups: {
|
|
- // node_modules模块包
|
|
|
|
|
|
+ // node_modules模锟斤拷锟�
|
|
vendors: {
|
|
vendors: {
|
|
test: /[\\/]node_modules[\\/]/,
|
|
test: /[\\/]node_modules[\\/]/,
|
|
name: 'chunk-vendors',
|
|
name: 'chunk-vendors',
|
|
@@ -158,7 +158,7 @@ const vueConfig = {
|
|
chunks: 'all',
|
|
chunks: 'all',
|
|
priority: -10,
|
|
priority: -10,
|
|
},
|
|
},
|
|
- // UI库单独拆包
|
|
|
|
|
|
+ // UI锟解单锟斤拷锟斤拷锟�
|
|
antDesign: {
|
|
antDesign: {
|
|
name: 'chunk-antDesign',
|
|
name: 'chunk-antDesign',
|
|
priority: 19, // the weight needs to be larger than libs and app or it will be packaged into libs or app
|
|
priority: 19, // the weight needs to be larger than libs and app or it will be packaged into libs or app
|
|
@@ -169,18 +169,18 @@ const vueConfig = {
|
|
priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
|
|
priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
|
|
test: /[\\/]node_modules[\\/]_?ant-design-vue(.*)/
|
|
test: /[\\/]node_modules[\\/]_?ant-design-vue(.*)/
|
|
},
|
|
},
|
|
- // 共享模块
|
|
|
|
|
|
+ // 锟斤拷锟斤拷模锟斤拷
|
|
common: {
|
|
common: {
|
|
name: 'chunk-common',
|
|
name: 'chunk-common',
|
|
minChunks: 2,
|
|
minChunks: 2,
|
|
- maxSize: 1024, //拆分之前最大的数值,默认为0,即不做限制
|
|
|
|
|
|
+ maxSize: 1024, //锟斤拷锟街�帮拷锟斤拷锟斤拷锟街碉拷锟侥�拷锟轿�0锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷
|
|
priority: -20,
|
|
priority: -20,
|
|
reuseExistingChunk: true
|
|
reuseExistingChunk: true
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
- // 分析打包大小
|
|
|
|
|
|
+ // 锟斤拷锟斤拷锟斤拷锟斤拷锟叫�
|
|
if (process.env.npm_config_report) {
|
|
if (process.env.npm_config_report) {
|
|
config.plugin('webpack-bundle-analyzer')
|
|
config.plugin('webpack-bundle-analyzer')
|
|
.use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
|
|
.use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
|
|
@@ -211,8 +211,8 @@ const vueConfig = {
|
|
// If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
|
|
// If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
|
|
proxy: {
|
|
proxy: {
|
|
'/api': {
|
|
'/api': {
|
|
- // target: 'http://192.168.0.183:8503/qpls-md',
|
|
|
|
- target: 'http://p.iscm.360arrow.com/qpls-md',
|
|
|
|
|
|
+ target: 'http://192.168.0.183:8503/qpls-md',
|
|
|
|
+ // target: 'http://p.iscm.360arrow.com/qpls-md',
|
|
// ws: false,
|
|
// ws: false,
|
|
ws: true,
|
|
ws: true,
|
|
changeOrigin: true,
|
|
changeOrigin: true,
|