shangyun/Web/vite.config.ts

import vue from '@vitejs/plugin-vue'
import path from 'path'
import { ConfigEnv, defineConfig, loadEnv } from 'vite'
import { viteVConsole } from 'vite-plugin-vconsole'

export default defineConfig(({ mode, command }: ConfigEnv) => {
  const env = loadEnv(mode, process.cwd());
  return {
    base: '/',
    css: {
      preprocessorOptions: {
        scss: {
          additionalData: '@import "./src/styles/variables";'
        },
      }
    },
    resolve: {
      alias: [
        {
          find: '/@',
          replacement: path.resolve(__dirname, './src'),
        }
      ],
    },
    server: {
      // 监听所有地址
      host: '0.0.0.0',
      // 自定义端口号
      port: 3010,
      // 自动打开浏览器
      open: true,
      // 开启热更新
      hmr: true,
      // 若端口被占用，自动尝试下一个可用端口
      strictPort: false,
      // 代理规则
      proxy: {
        '/api': {
          // 开启跨域
          changeOrigin: true,
          // 转发地址
          target: env.VITE_APP_API_URL,
          // 路径重写
          rewrite: (path) => path.replace(/^\/api/, ''),
        }
      }
    },
    build: {
      outDir: 'dist',// 指定打包文件根目录
      sourcemap: false,// 构建后不生成源代码
      write: true,// 构建的文件写入磁盘
      chunkSizeWarningLimit: 10240,// 触发警告的chunk大小10M
    },
    esbuild: {
      drop: mode === 'production' ? ['console', 'debugger'] : [],
    },
    plugins: [
      vue(),
      viteVConsole({
        entry: path.resolve(__dirname, './src/main.ts'), // 入口文件
        localEnabled: command === 'serve', // serve开发环境下
        // enabled: command !== 'serve' || mode === 'test', // 打包环境下/发布测试包,
        config: { // vconsole 配置项
          maxLogNumber: 1000,
          theme: 'light'
        }
      }),
    ],
  }
})