import { ConfigEnv, UserConfig, defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import { resolve } from "path";
// 是从vite里面导入否则会报错AutoImport不是一个function
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import Icons from "unplugin-icons/vite";
import IconsResolver from "unplugin-icons/resolver";
// UnoCSS
import UnoCSS from "unocss/vite";

import { createSvgIconsPlugin } from "vite-plugin-svg-icons";
const pathSrc = resolve(__dirname, "src");
// https://vitejs.dev/config/
export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
    const env = loadEnv(mode, process.cwd());
    return {
        resolve: {
            alias: {
                "@": pathSrc,
            },
        },
        plugins: [
            vue(),
            UnoCSS({
                hmrTopLevelAwait: false,
            }),
            AutoImport({
                // 自动导入Vue的相关API
                imports: ["vue", "@vueuse/core"],
                // dts: false, //关掉避免每次都生成一次
                dts: resolve(pathSrc, "types", "auto-imports.d.ts"), // 指定自动导入函数TS类型声明文件路径

                resolvers: [
                    // 自动导入 Element Plus 组件
                    ElementPlusResolver(),
                    // 自动导入图标组件
                    IconsResolver({}),
                ],
                eslintrc: {
                    enabled: false,
                    filepath: "./.eslintrc-auto-import.json",
                    globalsPropValue: true,
                },
                vueTemplate: true, // 是否在Vue模板中导入
            }),
            Components({
                resolvers: [
                    // 自动注册
                    ElementPlusResolver(),
                    // 自动注册
                    IconsResolver({
                        enabledCollections: ["ep"], // element-plus图标库，其他图标库 https://icon-sets.iconify.design/
                    }),
                ],
                // dts: false,
                dts: resolve(pathSrc, "types", "components.d.ts"), //  自动导入组件类型声明文件位置，默认根目录
            }),
            Icons({
                // 自动安装图标库
                autoInstall: true,
            }),
            createSvgIconsPlugin({
                // 指定需要缓存的图标文件夹
                iconDirs: [resolve(pathSrc, "assets/icons")],
                // 指定symbolId格式
                symbolId: "icon-[dir]-[name]",
            }),
        ],

        css: {
            // CSS 预处理器
            preprocessorOptions: {
                // 定义全局 SCSS 变量
                scss: {
                    javascriptEnabled: true,
                    additionalData: `
                  @use "@/styles/variables.scss" as *;
                `,
                },
            },
        },
    };
});