vite中导入基础样式文件，以供在全局下直接使用全局 less 变量

vite中导入基础样式文件，以供在全局下直接使用全局 less 变量，否则会报错 undefined

1. 先新建 base.less 文件，定义基础样式变量
2. 在 vite.config.ts 下 添加配置

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import { resolve } from "path";

// https://vitejs.dev/config/
export default defineConfig({
    plugins: [
        AutoImport({
            resolvers: [ElementPlusResolver()],
        }),
        Components({
            resolvers: [ElementPlusResolver()],
        }),
        vue(),
    ],
    resolve: {
        alias: {
            "@": resolve(__dirname, "./src"), //把 src 的别名设置为 @
        },
    },
    css: {
        preprocessorOptions: {
            less: {
                javascriptEnabled: true,
                additionalData: `@import "${resolve(
                    __dirname,
                    "src/assets/styles/base.less"
                )}";`,
            },
        },
    },
});