SOURCE

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 命令行工具 X clear

                    
>
console