vite项目中使用@代表根路径问题及解决
作者：Jyann~
解决Vite配置vite.config.ts时路径报错问题,需在tsconfig.json中添加baseUrl和paths配置,同时处理path和__dirname找不到模块的问题
1.配置vite.config.ts
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
export default defineConfig({
plugins: [vue()],
resolve: {
alias:{
'@': path.resolve(__dirname, 'src') }
}
})
2.报错path和__dirname
- 找不到模块“path”或其相应的类型声明。
- 找不到名称“__dirname”
npm i path -D
npm install --save-dev @types/node
3.vue文件中引入文件报错
Cannot find module '@/api/index' or its corresponding type declarations.
import { chunk } from "@/api/index"
解决：
在 tsconfig.json的compilerOptions下 加上 baseUrl 和 paths 即可。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。