vite.config.js 别名配置

resolve.alias

• 类型： Record<string, string> | Array<{ find: string | RegExp, replacement: string }>

  将会被传递到 @rollup/plugin-alias 作为 entries 的选项。也可以是一个对象，或一个 { find, replacement } 的数组.

  当使用文件系统路径的别名时，请始终使用绝对路径。相对路径的别名值会被原封不动地使用，因此无法被正常解析。

  更高级的自定义解析方法可以通过 插件 实现。

import {defineConfig
} from 'vite'
import path from "path";
import vue from '@vitejs/plugin-vue'// https://vitejs.dev/config/
export default defineConfig({resolve: {alias: {"@": path.resolve(__dirname, "src"),"components": path.resolve(__dirname, "src/components"),"styles": path.resolve(__dirname, "src/styles"),"plugins": path.resolve(__dirname, "src/plugins"),"views": path.resolve(__dirname, "src/views"),"layouts": path.resolve(__dirname, "src/layouts"),"utils": path.resolve(__dirname, "src/utils"),"apis": path.resolve(__dirname, "src/apis"),"dirs": path.resolve(__dirname, "src/directives"),},},plugins: [vue()],
});

或者 数组的形式

import {defineConfig
} from 'vite'
import path from "path";
import vue from '@vitejs/plugin-vue'// https://vitejs.dev/config/
export default defineConfig({resolve: {alias: [{find: '@',replacement: path.resolve(__dirname, 'src')},{find: 'components',replacement: path.resolve(__dirname, 'src/components')}],},plugins: [vue()],
});

注意要导入path啊，还有vite.config配置要关项目重启，老铁踩坑点赞