149 lines
3.4 KiB
TypeScript
149 lines
3.4 KiB
TypeScript
import { fileURLToPath, URL } from 'node:url'
|
|
|
|
import { defineConfig, loadEnv } from 'vite'
|
|
import vue from '@vitejs/plugin-vue'
|
|
import AutoImport from 'unplugin-auto-import/vite'
|
|
import Components from 'unplugin-vue-components/vite'
|
|
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
|
|
|
|
export default defineConfig(({ mode }) => {
|
|
const env = loadEnv(mode, process.cwd(), '')
|
|
const allowedHosts = parseAllowedHosts(env.VITE_ALLOWED_HOSTS)
|
|
|
|
return {
|
|
plugins: [
|
|
vue(),
|
|
AutoImport({
|
|
imports: ['vue', 'vue-router'],
|
|
dts: 'src/auto-imports.d.ts',
|
|
resolvers: [ElementPlusResolver({ importStyle: 'css' })],
|
|
}),
|
|
Components({
|
|
dts: 'src/components.d.ts',
|
|
resolvers: [ElementPlusResolver({ importStyle: 'css' })],
|
|
}),
|
|
],
|
|
resolve: {
|
|
alias: {
|
|
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
|
},
|
|
},
|
|
server: {
|
|
host: env.VITE_DEV_HOST === 'true',
|
|
allowedHosts: env.VITE_ALLOW_ALL_HOSTS === 'true' ? true : allowedHosts,
|
|
proxy: {
|
|
'/api': {
|
|
target: env.VITE_API_TARGET || 'http://localhost:3000',
|
|
changeOrigin: true,
|
|
},
|
|
},
|
|
},
|
|
build: {
|
|
rollupOptions: {
|
|
output: {
|
|
manualChunks: splitVendorChunk,
|
|
},
|
|
},
|
|
},
|
|
}
|
|
})
|
|
|
|
function parseAllowedHosts(value?: string) {
|
|
const hosts = value
|
|
?.split(',')
|
|
.map((host) => host.trim())
|
|
.filter(Boolean)
|
|
|
|
return hosts && hosts.length > 0 ? hosts : ['localhost', '127.0.0.1']
|
|
}
|
|
|
|
const elementPlusChunkGroups: Array<[string, string[]]> = [
|
|
[
|
|
'element-plus-form',
|
|
[
|
|
'/components/form',
|
|
'/components/input',
|
|
'/components/select',
|
|
'/components/date-picker',
|
|
'/components/checkbox',
|
|
'/components/radio',
|
|
'/components/switch',
|
|
'/components/upload',
|
|
],
|
|
],
|
|
[
|
|
'element-plus-data',
|
|
[
|
|
'/components/table',
|
|
'/components/pagination',
|
|
'/components/tag',
|
|
'/components/card',
|
|
'/components/descriptions',
|
|
'/components/empty',
|
|
],
|
|
],
|
|
[
|
|
'element-plus-feedback',
|
|
[
|
|
'/components/message',
|
|
'/components/message-box',
|
|
'/components/dialog',
|
|
'/components/popover',
|
|
'/components/tooltip',
|
|
'/components/loading',
|
|
],
|
|
],
|
|
[
|
|
'element-plus-navigation',
|
|
['/components/menu', '/components/tabs', '/components/breadcrumb', '/components/dropdown'],
|
|
],
|
|
[
|
|
'element-plus-layout',
|
|
[
|
|
'/components/container',
|
|
'/components/row',
|
|
'/components/col',
|
|
'/components/space',
|
|
'/components/divider',
|
|
],
|
|
],
|
|
]
|
|
|
|
function splitVendorChunk(id: string) {
|
|
if (!id.includes('/node_modules/')) {
|
|
return
|
|
}
|
|
|
|
if (id.includes('/node_modules/@element-plus/icons-vue/')) {
|
|
return 'element-plus-icons'
|
|
}
|
|
|
|
if (id.includes('/node_modules/element-plus/')) {
|
|
return splitElementPlusChunk(id)
|
|
}
|
|
|
|
if (id.includes('/node_modules/vue/') || id.includes('/node_modules/vue-router/')) {
|
|
return 'vue-vendor'
|
|
}
|
|
|
|
if (id.includes('/node_modules/axios/')) {
|
|
return 'axios'
|
|
}
|
|
|
|
if (id.includes('/node_modules/qrcode/')) {
|
|
return 'qrcode'
|
|
}
|
|
|
|
return 'vendor'
|
|
}
|
|
|
|
function splitElementPlusChunk(id: string) {
|
|
for (const [chunkName, includesList] of elementPlusChunkGroups) {
|
|
if (includesList.some((includePath) => id.includes(includePath))) {
|
|
return chunkName
|
|
}
|
|
}
|
|
|
|
return 'element-plus-core'
|
|
}
|