-
Notifications
You must be signed in to change notification settings - Fork 131
/
Copy pathvite.config.ts
executable file
·259 lines (255 loc) · 9.59 KB
/
vite.config.ts
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
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import viteCompression from 'vite-plugin-compression'
import Components from 'unplugin-vue-components/vite'
import AutoImport from 'unplugin-auto-import/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { fileURLToPath } from 'url'
// import viteImagemin from 'vite-plugin-imagemin'
// import { visualizer } from 'rollup-plugin-visualizer'
export default ({ mode }) => {
const root = process.cwd()
const env = loadEnv(mode, root)
const { VITE_VERSION, VITE_PORT, VITE_BASE_URL, VITE_API_URL } = env
console.log(`🚀 API_URL = ${VITE_API_URL}`)
console.log(`🚀 VERSION = ${VITE_VERSION}`)
return defineConfig({
define: {
__APP_VERSION__: JSON.stringify(VITE_VERSION)
},
base: VITE_BASE_URL,
server: {
port: parseInt(VITE_PORT),
proxy: {
'/api': {
target: VITE_API_URL,
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '')
}
},
host: true
},
// 路径别名
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
'@views': resolvePath('src/views'),
'@comps': resolvePath('src/components'),
'@imgs': resolvePath('src/assets/img'),
'@icons': resolvePath('src/assets/icons'),
'@utils': resolvePath('src/utils'),
'@stores': resolvePath('src/store'),
'@plugins': resolvePath('src/plugins'),
'@styles': resolvePath('src/assets/styles')
}
},
build: {
target: 'es2015',
outDir: 'dist',
chunkSizeWarningLimit: 2000,
minify: 'terser',
terserOptions: {
compress: {
drop_console: true, // 生产环境去除 console
drop_debugger: true // 生产环境去除 debugger
}
},
rollupOptions: {
output: {
manualChunks: {
vendor: ['vue', 'vue-router', 'pinia', 'element-plus']
}
}
},
dynamicImportVarsOptions: {
warnOnError: true,
exclude: [],
include: ['src/views/**/*.vue']
}
},
plugins: [
vue(),
// 自动导入 components 下面的组件,无需 import 引入
Components({
deep: true,
extensions: ['vue'],
dirs: ['src/components'], // 自动导入的组件目录
resolvers: [ElementPlusResolver()],
dts: 'src/types/components.d.ts' // 指定类型声明文件的路径
}),
AutoImport({
imports: ['vue', 'vue-router', '@vueuse/core', 'pinia'],
resolvers: [ElementPlusResolver()],
dts: 'src/types/auto-imports.d.ts',
eslintrc: {
// 这里先设置成true然后pnpm dev 运行之后会生成 .auto-import.json 文件之后,在改为false
enabled: true,
filepath: './.auto-import.json',
globalsPropValue: true
}
}),
// 打包分析
// visualizer({
// open: true,
// gzipSize: true,
// brotliSize: true,
// filename: 'dist/stats.html' // 分析图生成的文件名及路径
// }),
// 压缩
viteCompression({
verbose: true, // 是否在控制台输出压缩结果
disable: false, // 是否禁用
algorithm: 'gzip', // 压缩算法,可选 [ 'gzip' , 'brotliCompress' ,'deflate' , 'deflateRaw']
ext: '.gz', // 压缩后的文件名后缀
threshold: 10240, // 只有大小大于该值的资源会被处理 10240B = 10KB
deleteOriginFile: false // 压缩后是否删除原文件
})
// 图片压缩
// viteImagemin({
// verbose: true, // 是否在控制台输出压缩结果
// // 图片压缩配置
// // GIF 图片压缩配置
// gifsicle: {
// optimizationLevel: 4, // 优化级别 1-7,7为最高级别压缩
// interlaced: false // 是否隔行扫描
// },
// // PNG 图片压缩配置
// optipng: {
// optimizationLevel: 4 // 优化级别 0-7,7为最高级别压缩
// },
// // JPEG 图片压缩配置
// mozjpeg: {
// quality: 60 // 压缩质量 0-100,值越小压缩率越高
// },
// // PNG 图片压缩配置(另一个压缩器)
// pngquant: {
// quality: [0.8, 0.9], // 压缩质量范围 0-1
// speed: 4 // 压缩速度 1-11,值越大压缩速度越快,但质量可能会下降
// },
// // SVG 图片压缩配置
// svgo: {
// plugins: [
// {
// name: 'removeViewBox' // 移除 viewBox 属性
// },
// {
// name: 'removeEmptyAttrs', // 移除空属性
// active: false // 是否启用此插件
// }
// ]
// }
// })
],
// 预加载项目必需的组件
optimizeDeps: {
include: [
'vue',
'vue-router',
'pinia',
'axios',
'@vueuse/core',
'echarts',
'@wangeditor/editor',
'@wangeditor/editor-for-vue',
'vue-i18n',
'element-plus/es/components/form/style/css',
'element-plus/es/components/form-item/style/css',
'element-plus/es/components/button/style/css',
'element-plus/es/components/input/style/css',
'element-plus/es/components/input-number/style/css',
'element-plus/es/components/switch/style/css',
'element-plus/es/components/upload/style/css',
'element-plus/es/components/menu/style/css',
'element-plus/es/components/col/style/css',
'element-plus/es/components/icon/style/css',
'element-plus/es/components/row/style/css',
'element-plus/es/components/tag/style/css',
'element-plus/es/components/dialog/style/css',
'element-plus/es/components/loading/style/css',
'element-plus/es/components/radio/style/css',
'element-plus/es/components/radio-group/style/css',
'element-plus/es/components/popover/style/css',
'element-plus/es/components/scrollbar/style/css',
'element-plus/es/components/tooltip/style/css',
'element-plus/es/components/dropdown/style/css',
'element-plus/es/components/dropdown-menu/style/css',
'element-plus/es/components/dropdown-item/style/css',
'element-plus/es/components/sub-menu/style/css',
'element-plus/es/components/menu-item/style/css',
'element-plus/es/components/divider/style/css',
'element-plus/es/components/card/style/css',
'element-plus/es/components/link/style/css',
'element-plus/es/components/breadcrumb/style/css',
'element-plus/es/components/breadcrumb-item/style/css',
'element-plus/es/components/table/style/css',
'element-plus/es/components/tree-select/style/css',
'element-plus/es/components/table-column/style/css',
'element-plus/es/components/select/style/css',
'element-plus/es/components/option/style/css',
'element-plus/es/components/pagination/style/css',
'element-plus/es/components/tree/style/css',
'element-plus/es/components/alert/style/css',
'element-plus/es/components/radio-button/style/css',
'element-plus/es/components/checkbox-group/style/css',
'element-plus/es/components/checkbox/style/css',
'element-plus/es/components/tabs/style/css',
'element-plus/es/components/tab-pane/style/css',
'element-plus/es/components/rate/style/css',
'element-plus/es/components/date-picker/style/css',
'element-plus/es/components/notification/style/css',
'element-plus/es/components/image/style/css',
'element-plus/es/components/statistic/style/css',
'element-plus/es/components/watermark/style/css',
'element-plus/es/components/config-provider/style/css',
'element-plus/es/components/text/style/css',
'element-plus/es/components/drawer/style/css',
'element-plus/es/components/color-picker/style/css',
'element-plus/es/components/backtop/style/css',
'element-plus/es/components/message-box/style/css',
'element-plus/es/components/skeleton/style/css',
'element-plus/es/components/skeleton/style/css',
'element-plus/es/components/skeleton-item/style/css',
'element-plus/es/components/badge/style/css',
'element-plus/es/components/steps/style/css',
'element-plus/es/components/step/style/css',
'element-plus/es/components/avatar/style/css',
'element-plus/es/components/descriptions/style/css',
'element-plus/es/components/descriptions-item/style/css',
'element-plus/es/components/checkbox-group/style/css',
'element-plus/es/components/progress/style/css',
'element-plus/es/components/image-viewer/style/css',
'element-plus/es/components/empty/style/css',
'element-plus/es/components/segmented/style/css'
]
},
css: {
preprocessorOptions: {
// sass variable and mixin
scss: {
api: 'modern-compiler',
additionalData: `
@use "@styles/variables.scss" as *; @use "@styles/mixin.scss" as *;
`
}
},
postcss: {
plugins: [
{
postcssPlugin: 'internal:charset-removal',
AtRule: {
charset: (atRule) => {
if (atRule.name === 'charset') {
atRule.remove()
}
}
}
}
]
}
}
})
}
function resolvePath(paths) {
return path.resolve(__dirname, paths)
}