aps-test/as-system-manage-web/vite.config.ts

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]'
            }
        }
    }
}));