// vite.config.mts import { resolve } from 'path'; import { fileURLToPath, URL } from 'node:url'; import { defineConfig, ConfigEnv, UserConfig, loadEnv } from 'vite'; import vue from '@vitejs/plugin-vue'; import vueJsx from '@vitejs/plugin-vue-jsx'; import vueDevTools from 'vite-plugin-vue-devtools'; import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'; import viteCompression from 'vite-plugin-compression'; import pkg from './package.json'; import dts from 'vite-plugin-dts'; import UnoCSS from 'unocss/vite'; // 由于我们使用的是 ESM,不再需要 const path = require('node:path'); // 直接使用 import { resolve } from 'path'; 即可 export default defineConfig(({ mode }: ConfigEnv): UserConfig => { const root = process.cwd(); const env = loadEnv(mode, root); return { base: env.VITE_PUBLIC_PATH, root, plugins: [ vue(), vueJsx(), vueDevTools(), // 使用 svg 图标 // createSvgIconsPlugin({ // iconDirs: [resolve(process.cwd(), 'src/assets/icons')], // symbolId: 'icon-[dir]-[name]' // }), UnoCSS({ // 在低版本浏览器上开发时会报错 Unexpected reserved word // 如果在开发环境需要兼容不支持顶级await的低版本浏览器例如Chrome(v87),就将下面的配置打开 // hmrTopLevelAwait: false }), createSvgIconsPlugin({ // 指定需要缓存的图标文件夹 iconDirs: [resolve(process.cwd(), 'src/assets/icons')], // 指定symbolId格式 symbolId: 'mt-edit-[name]', // 禁用压缩 否则想要修改无状态组件的stroke或者fill会影响到预设样式 例如stroke-width svgoOptions: false, customDomId: '___mt__edit__icons__dom__' }), // 配置 gzip 压缩插件 viteCompression({ algorithm: 'gzip', // 使用 gzip 压缩 ext: '.gz', // 压缩文件扩展名 threshold: 10240, // 只有大于 10 KB 的文件才会被压缩 deleteOriginFile: false // 不删除源文件 }) ], define: { __APP_VERSION__: JSON.stringify(pkg.version) }, resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url)), 'package.json': new URL('package.json', import.meta.url).pathname } }, css: { preprocessorOptions: { scss: { api: 'modern-compiler', // https://github.com/sass/dart-sass/issues/2395#issuecomment-988870897 additionalData: `@use "@/styles/element/index.scss" as *;` } } }, server: { host: '0.0.0.0', port: Number(env.VITE_PORT), open: env.VITE_OPEN === 'true', proxy: { '/api': { target: env.VITE_API_URL, changeOrigin: true, ws: true, rewrite: path => path.replace(new RegExp(`^/api`), ''), // https is require secure=false ...(/^https:\/\//.test(env.VITE_API_URL) ? { secure: false } : {}) } } }, }; });