import { defineConfig, loadEnv } from 'vite'; import { resolve } from 'path'; import vue from '@vitejs/plugin-vue'; import Markdown from 'vite-plugin-md'; import viteCompression from 'vite-plugin-compression'; import DefineOptions from 'unplugin-vue-define-options/vite'; // Setup 中 Component Name 定义语法糖插件 import AutoImport from 'unplugin-auto-import/vite'; import Components from 'unplugin-vue-components/vite'; import Icons from 'unplugin-icons/vite'; import IconsResolver from 'unplugin-icons/resolver'; import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'; import { dirResolver, DirResolverHelper } from 'vite-auto-import-resolvers'; export default defineConfig(({ mode }) => ({ // 部署到子路径时,需配置 base,例如 /aps/ base: loadEnv(mode, process.cwd()).VITE_APP_BASE || '/', plugins: [ vue({ include: [/\.vue$/, /\.md$/] }), Markdown(), DirResolverHelper(), AutoImport({ include: [/\.[tj]sx?$/, /\.vue$/, /\.md$/], imports: [ 'vue', 'vue-router', 'pinia', '@vueuse/core', { axios: [ // 默认导入 ['default', 'axios'] // import { default as axios } from 'axios', ] } ], resolvers: [ IconsResolver({ prefix: 'Icon' // 自动导入图标组件 }), ElementPlusResolver(), dirResolver({ target: 'src/hooks', prefix: 'use' }), dirResolver({ target: 'src/store/modules', suffix: 'Store' // 强制后缀为 Store }) ], dts: 'types/auto-imports.d.ts', eslintrc: { enabled: true // 每次启动服务会生成一次,生成后记得设置 false 关闭 } }), Components({ dirs: ['src/components'], resolvers: [ IconsResolver({ enabledCollections: ['ep'] // 自动注册图标组件 }), ElementPlusResolver() ], dts: 'types/components.d.ts' // 每次启动服务会生成一次,生成后记得设置 false 关闭 }), Icons({ autoInstall: true }), viteCompression({ threshold: 10240 }), DefineOptions() ], server: { port: 8080, host: true, proxy: { [`${loadEnv(mode, process.cwd()).VITE_APP_BASE_API}`]: { // rewrite: path => path.replace(/^\/api/, ''), target: loadEnv(mode, process.cwd()).VITE_APP_PROXY_URL, changeOrigin: true } } }, resolve: { alias: { '@': resolve(__dirname, 'src'), docs: resolve(__dirname, 'docs') }, extensions: ['.vue', '.ts', '.js', '.css', '.scss', '.jsx', '.json', '.md'] }, css: { preprocessorOptions: { scss: { additionalData: `@import "@/assets/style/global.scss";` // 全局的scss文件 } } }, build: { emptyOutDir: true, sourcemap: true, rollupOptions: { input: { index: resolve(__dirname, 'index.html') }, output: { chunkFileNames: 'assets/js/[name]-[hash].js', entryFileNames: 'assets/js/[name]-[hash].js', assetFileNames: 'assets/[ext]/[name]-[hash].[ext]' } } } }));