vite.config.js

import path from "path";
import { defineConfig } from "vite";
import Vue from "@vitejs/plugin-vue";
import Pages from "vite-plugin-pages";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import {
  createStyleImportPlugin,
  ElementPlusResolve,
} from "vite-plugin-style-import";
import Unocss from "unocss/vite";
import {
  presetAttributify,
  presetIcons,
  presetUno,
  transformerDirectives,
  transformerVariantGroup,
} from "unocss";
const pathSrc = path.resolve(__dirname, "src");

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    Vue(),
    Pages({ importMode: "sync" }),
    Components({
      extensions: ["vue"],
      include: [/\.vue$/, /\.vue\?vue/],
      resolvers: [ElementPlusResolver({ importStyle: "sass" })],
      dts: "src/components.d.ts",
    }),
    Unocss({
      presets: [
        presetUno(),
        presetAttributify(),
        presetIcons({ scale: 1.2, warn: true }),
      ],
      transformers: [transformerDirectives(), transformerVariantGroup()],
    }),
    createStyleImportPlugin({
      resolves: [ElementPlusResolve()],
    }),
  ],
  resolve: {
    alias: {
      "~/": `${pathSrc}/`,
    },
  },
});