情况说明:在.vue后缀的文件中,引入ts文件,使用’@/xxx/xxx/xxx’报错找不到相应类型声明
解决办法:需要在默认生成的配置文件中,添加如下设置。
第一步:找到文件工程目录下的tsconfig.json文件,在CompilerOptions中加上baseUrl和paths两个参数。
{
"CompilerOptions": {
//解析非相对模块的基础地址,默认是当前目录
"baseUrl": "./",
//路径映射,相对于baseUrl
"paths": {
"@/*": ["./src/*"]
},
}
}
第二步:找到文件工程目录下的vite.config.ts文件。加入如下内容
1、导入import path
import path from 'path'
2、defineConfig添加如下内容
resolve: {
alias: {
'@': path.resolve(__dirname, 'src')
}
}
最后vite.config.ts文件全部内容如下:
import {defineConfig} from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
// https://vitejs.dev/config/
export default defineConfig({
resolve: {
alias: {
'@': path.resolve(__dirname, 'src')
}
},
plugins: [vue()]
})
这时候就可以正常使用@符号啦,这里@符号是设置的src文件目录下,如有需要可以修改。