首先在 vite.config.ts
中配置 resolve
import { defineConfig } from 'vite';
import path from "path";
// https://vitejs.dev/config/
export default ({ mode }) => defineConfig({
// ...
resolve: {
// 配置路径别名
alias: {
// ...
'_WBX_': path.resolve(__dirname, './src/components/wbx-comp')
}
}
})
然后在 tsconfig.ts
中配置 paths
{
"compilerOptions": {
// ...
"paths": {
// ...
"_WBX_*": ["src/components/wbx-comp/*"]
}
}
}
接下来你在项目中引入 src/components/wbx-comp
下面的组件就可以使用:
import WebxueDemo from "_WBX_/webxue-demo/index.vue";
当然,如果你指定的路径没在 src
下,需要检查你的 tsconfig.json
中的 include
字段是否包含你的文件名
{
"compilerOptions": {
// ...
"baseUrl": "./",
"paths":{
"_WBX_/*":["package/*"]
}
},
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue","package"]
}