以下面这个目录结构为例：
以vite为例，webpack也一样，vite.config.ts:
import {
defineConfig} from 'vite'
import vue from '@vitejs/plugin-vue'
import * as path from "path";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
'~': path.resolve(__dirname, './packages'),
// '@': '/src',
// '~': '/packages',
}
}
})
在这里配置打包编译时候的别名，用path.resolve解析成绝对地址也可以，用'@': '/src'直接指定项目根路径也可以。用js的时候，配置别名就完成了。如果用TS还需要，配置tsconfig.json:
"baseUrl": "./",
"paths": {
"@/*": [
"src/*"
],
"~/*": [
"packages/*"
]
}
ts路径设置规则
外注意有没有安装@types/node