|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112 |
- import vue from "@vitejs/plugin-vue";
-
- import { UserConfig, ConfigEnv, loadEnv, defineConfig } from "vite";
-
- 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";
- import postCssPxToRem from 'postcss-pxtorem'
- import { createSvgIconsPlugin } from "vite-plugin-svg-icons";
-
- import UnoCSS from "unocss/vite";
-
- import path from "path";
- const pathSrc = path.resolve(__dirname, "src");
-
- export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
- const env = loadEnv(mode, process.cwd());
- return {
- resolve: {
- alias: {
- "@": pathSrc,
- },
- },
- css: {
- // CSS 预处理器
- preprocessorOptions: {
- //define global scss variable
- scss: {
- javascriptEnabled: true,
- additionalData: `
- @use "@/styles/variables.scss" as *;
- `,
- },
- },
- postcss: {
- plugins: [
- postCssPxToRem({
- rootValue: 192, // 1rem 的大小
- propList: ['*'], // 需要转换的属性,*(全部转换)
- unitPrecision: 6 // 转换精度,保留的小数位数
- })
- ]
- }
- },
- server: {
- host: "0.0.0.0",
- port: Number(env.VITE_APP_PORT),
- open: true, // 运行是否自动打开浏览器
- proxy: {
- // 反向代理解决跨域
- "/api": {
- target: env.VITE_APP_BASE_API, // 线上接口地址
- changeOrigin: true,
- rewrite: (path) => path.replace(/^\/api/, ""),
- },
- },
- },
- plugins: [
- vue(),
- UnoCSS({
- /* options */
- }),
- AutoImport({
- // 自动导入 Vue 相关函数,如:ref, reactive, toRef 等
- imports: ["vue", "@vueuse/core"],
- // eslintrc: {
- // enabled: false, // Default `false`
- // filepath: "./.eslintrc-auto-import.json", // Default `./.eslintrc-auto-import.json`
- // globalsPropValue: true, // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
- // },
- resolvers: [
- // 自动导入 Element Plus 相关函数,如:ElMessage, ElMessageBox... (带样式)
- ElementPlusResolver(),
- // 自动导入图标组件
- IconsResolver({}),
- ],
- vueTemplate: true, // 是否在 vue 模板中自动导入
- dts: path.resolve(pathSrc, "types", "auto-imports.d.ts"), // 自动导入组件类型声明文件位置,默认根目录; false 关闭自动生成
- }),
-
- Components({
- resolvers: [
- // 自动注册图标组件
- IconsResolver({
- enabledCollections: ["ep"], //@iconify-json/ep 是 Element Plus 的图标库
- }),
- // 自动导入 Element Plus 组件
- ElementPlusResolver(),
- ],
- dts: path.resolve(pathSrc, "types", "components.d.ts"), // 自动导入组件类型声明文件位置,默认根目录; false 关闭自动生成
- }),
-
- Icons({
- // 自动安装图标库
- autoInstall: true,
- }),
-
- createSvgIconsPlugin({
- // 指定需要缓存的图标文件夹
- iconDirs: [path.resolve(pathSrc, "assets/icons")],
- // 指定symbolId格式
- symbolId: "icon-[dir]-[name]",
- }),
- ],
- // define: {
- // global: {},
- // },
- };
- });
|