import {defineConfig, loadEnv} from 'vite';
import {resolve} from 'path';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import basicSsl from '@vitejs/plugin-basic-ssl';
import {createHtmlPlugin} from 'vite-plugin-html';
import {svgBuilder} from './src/plugins/svgBuilder.js';
import {viteMockServe} from 'vite-plugin-mock';
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(), '');
return {
base: env.VITE_BASE_URL,
server: {
hmr: true, // 开启热更新
host: '0.0.0.0',
port: 8081,
open: false,
https: false,
cors: true,
overlay: false,
proxy: env.VITE_PROXY_API_URL && {
'/aiops-server/real-time-dashboard': {
target: env.VITE_PROXY_API_URL,
changeOrigin: true,
ws: true,
secure: false
},
'/aiops-server/fault-analyzed': {
target: env.VITE_PROXY_API_URL,
changeOrigin: true,
ws: true,
secure: false
}
}
},
resolve: {
alias: [
{
find: '_@',
replacement: resolve(__dirname, 'src')
},
{
find: '_api',
replacement: resolve(__dirname, 'src/api')
},
{
find: '_components',
replacement: resolve(__dirname, 'src/components')
},
{
find: '_layout',
replacement: resolve(__dirname, 'src/layout')
},
{
find: '_views',
replacement: resolve(__dirname, 'src/views')
}
],
extensions: ['.js', '.jsx', '.json', '.vue', '.scss']
},
plugins: [
vue(),
AutoImport({
resolvers: [ElementPlusResolver({importStyle: 'sass'})]
}),
Components({
resolvers: [ElementPlusResolver({importStyle: 'sass'})],
extensions: ['vue', 'ts', 'tsx']
}),
createHtmlPlugin({
minify: true,
entry: 'src/main.js',
template: 'index.html',
inject: {
data: {
title: '智能运维',
injectScript: `<link rel="icon" href="./static/logo.png"><script src="./static/system-config.js?timestamp=${new Date().getTime()}"></script>`
}
}
}),
vueJsx(),
basicSsl(),
svgBuilder('./src/icons/svg/'),
viteMockServe({
mockPath: 'mock',
enable: mode === 'development'
})
],
css: {
preprocessorOptions: {
scss: {
additionalData: '@use "_@/assets/css/variable.scss" as *;@use "_@/assets/css/reset.scss" as *;'
}
}
},
build: {
minify: 'terser',
terserOptions: {
compress: {
drop_console: true,
drop_debugger: true
}
},
outDir: 'aiops-model',
sourcemap: false,
assetsDir: 'static',
rollupOptions: {
output: {
manualChunks: {
lib: ['vue', 'vue-router', 'pinia', 'qs', 'element-plus', 'axios'],
echarts: ['echarts']
},
chunkFileNames: 'static/js/[name]-[hash].js',
entryFileNames: 'static/js/[name]-[hash].js',
assetFileNames: 'static/[ext]/[name]-[hash].[ext]'
}
}
}
};
});
console