-
Notifications
You must be signed in to change notification settings - Fork 0
/
vite.config.ts
110 lines (104 loc) · 3.16 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
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// vite 提供的操作env配置变量的方法loadEnv
import { loadEnv } from 'vite'
// nodejs写法,获取项目目录
import path from 'path'
// element-plus按需导入
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
// 图标
import PurgeIcons from 'vite-plugin-purge-icons'
// 一个针对 index.html,提供压缩和基于 ejs 模板功能的 vite 插件。
import { createHtmlPlugin } from 'vite-plugin-html'
// setup语法糖name增强,使vue3语法糖支持name属性。
import vueSetupExtend from 'vite-plugin-vue-setup-extend'
import { createVitePlugins } from './build/vite/plugin'
const pathResolve = (dirPath) => path.resolve(process.cwd(), dirPath)
// https://vitejs.dev/config/
export default ({ command, mode }) => {
console.log('command=', command)
const isBuild = command === 'build' // command = serve or build
return defineConfig({
plugins: [
vue(),
...createVitePlugins(isBuild),
vueSetupExtend(),
AutoImport({
resolvers: [ElementPlusResolver()]
}),
Components({
resolvers: [ElementPlusResolver()]
}),
PurgeIcons({
/* PurgeIcons Options */
content: ['**/*.html', '**/*.js', '**/*.vue']
}),
createHtmlPlugin({
minify: true,
/**
* 在这里写entry后,你将不需要在`index.html`内添加 script 标签,原有标签需要删除
* @default src/main.ts
*/
entry: '/src/main.ts',
/**
* 需要注入 index.html ejs 模版的数据
*/
inject: {
data: {
title: loadEnv(mode, process.cwd()).VITE_APP_TITLE,
injectScript: ''
},
tags: [
{
injectTo: 'body-prepend',
tag: 'div',
attrs: {
id: 'app'
}
}
]
}
})
],
// 服务器配置
server: {
host: '0.0.0.0',
port: Number(loadEnv(mode, process.cwd()).VITE_APP_PORT),
strictPort: true, // 端口被占用直接退出
https: false, // 默认用http方式
// open: true, // 在开发服务器启动时自动在浏览器中打开应用程序
proxy: {
// 代理配置
'/api': {
target: loadEnv(mode, process.cwd()).VITE_APP_BASE_URL,
changeOrigin: true, // 跨域配置
rewrite: (path) => path.replace(/^\/api/, '')
}
},
hmr: {
overlay: true // 屏蔽服务器报错
}
},
resolve: {
// 设置项目文件导入路径
alias: [
{
find: /\/@\//,
replacement: `${pathResolve('src')}/`
}
]
},
css: {
// css预处理器
preprocessorOptions: {
// 引入 var.scss 这样就可以在全局中使用 var.scss中预定义的变量了
// 给导入的路径最后加上 ;
scss: {
additionalData: '@import "/@/assets/css/global.scss";'
}
}
}
})
}