-
Notifications
You must be signed in to change notification settings - Fork 0
/
vue.config.js
112 lines (109 loc) · 3.41 KB
/
vue.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
const baseURL = process.env.VUE_APP_URL
const CompressionWebpackPlugin = require('compression-webpack-plugin')
const BundleAnalyzer = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
const path = require('path')
const resolve = (dir) => path.join(__dirname, '.', dir)
const productionGzipExtensions = ['js', 'css']
// 导入全局scss
function addStyleResource(rule) {
rule.use('style-resource')
.loader('style-resources-loader')
.options({
patterns: [
path.resolve(__dirname, './src/static/styles/common.scss')
]
})
}
// 开发的cdn
const devCdn = {
css: [
'https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.9/theme-chalk/index.min.css',
'https://cdn.bootcdn.net/ajax/libs/nprogress/0.2.0/nprogress.min.css'
],
js: ''
}
// 打包的cdn
const proCdn = {
css: [
'https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.9/theme-chalk/index.min.css',
'https://cdn.bootcdn.net/ajax/libs/nprogress/0.2.0/nprogress.min.css'
],
js: [
'https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.runtime.min.js',
'https://cdn.bootcdn.net/ajax/libs/vue-router/3.5.4/vue-router.min.js',
'https://cdn.bootcdn.net/ajax/libs/vuex/3.6.2/vuex.min.js',
'https://cdn.bootcdn.net/ajax/libs/axios/0.27.2/axios.min.js',
'https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.9/index.min.js',
'https://cdn.bootcdn.net/ajax/libs/nprogress/0.2.0/nprogress.min.js'
]
}
// 打包忽略
const objExternals = {
vue: 'Vue',
axios: 'axios',
vuex: 'Vuex',
'vue-router': 'VueRouter',
'element-ui': 'ELEMENT',
nprogress: 'NProgress'
}
module.exports = {
publicPath: './',
outputDir: 'dist',
assetsDir: 'assets',
lintOnSave: true,
productionSourceMap: false, // 不需要生产环境的 source map
chainWebpack: config => {
const types = ['vue-modules', 'vue', 'normal-modules', 'normal']
types.forEach(type => addStyleResource(config.module.rule('scss').oneOf(type)))
// 配置,将当前页定义的cdn值传到主页面(index.html)
config.plugin('html').tap(args => {
// 除本地环境,其余均使用CDN
args[0].cdn = process.env.VUE_APP_STAGE === 'development' ? devCdn : proCdn
return args
})
},
configureWebpack: {
devServer: {
open: false,
host: 'localhost',
port: '8800',
hot: true,
proxy: {
'/api': {
target: baseURL,
secure: false,
changeOrigin: true, // 是否允许跨域
pathRewrite: {
'^/api': '/'
}
}
}
},
resolve: {
extensions: ['.js', '.vue', '.json'],
// 别名
alias: {
'@': resolve('src')
}
},
// 定义webpack打包配置
externals: process.env.VUE_APP_STAGE === 'development' ? {} : objExternals,
plugins: [
// 配置compression-webpack-plugin压缩ZIP加速
new CompressionWebpackPlugin({
algorithm: 'gzip',
// eslint-disable-next-line
test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
threshold: 10240,
minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理
deleteOriginalAssets: false // 删除原文件
}),
// build时生成打包报告
new BundleAnalyzer({
analyzerMode: 'disabled', // 启用:server 不启用:disabled
openAnalyzer: true, // 是否自动打开报告页面
analyzerPort: 9999 // 报告页面端口
})
]
}
}