vue3-admin/vite.config.ts

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import path from "path";
import UnoCSS from "unocss/vite";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import ElementPlus from "unplugin-element-plus/vite";

// https://vite.dev/config/
export default defineConfig({
  resolve: {
    /**
     * 配置路径别名
     * @example import HelloWorld from '@/components/HelloWorld.vue'
     */
    alias: [{ find: "@", replacement: path.resolve(__dirname, "src") }]
  },
  plugins: [
    UnoCSS({
      configFile: "./UnoCSS.config.ts"
    }),
    vue(),
    AutoImport({
      // 自动导入 Vue 相关函数，如：ref, reactive, toRef 等
      // api
      imports: ["vue", "vue-router", "pinia"],
      resolvers: [ElementPlusResolver()],
      eslintrc: { enabled: false }
      // 生成相应的 .eslintrc-auto-import.json 文件。
      // 这样就可以在eslint中启用自动导入
    }),
    Components({
      // 解析 ElementPlus 组件
      resolvers: [ElementPlusResolver()],
      // 所有自定义组件可以自动加载，无需 import
      dirs: [
        "src/components",
        "src/layout/components",
        "src/views/**/components",
        "src/views/"
      ]
    }),
    ElementPlus({}) // 导入样式
  ]
});