Vite ( Vue + TS ) 项目配置 @ 路径别名
Vite 项目配置 @ 路径别名
·
1. 下载 @types/node 包
path 模块是 node.js 的内置模块,而 node.js 默认不支持 ts 文件的,所以需要安装 @type/node 依赖包
npm install @types/node --save-dev
2. 修改 vite.config.ts 文件
在相应位置增加如下代码
import {resolve} from 'path' // +++
export default defineConfig({
// ...
resolve: { // +++
alias: {
'@': resolve(__dirname, './src') // +++
} // +++
} // +++
})
3. 修改 ts.config.json 文件
在相应位置增加如下代码
{
"compilerOptions": {
// ...
"baseUrl": "./", // +++
"paths": { // +++
"@/*": ["src/*"] // +++
} // +++
},
// ...
}
4. 使用 @ 路径别名
在 vue 文件中可用 ‘@’ 引用相关组件
import Navigator from '@/components/Navigator.vue'
更多推荐
已为社区贡献2条内容
所有评论(0)