vite + vue3 + ts解决别名引用@/api/user报错找不到相应的模块
这里的前提是，文件路径以及文件已存在的情况下还是报错。
问题原因
vite + vue3 + ts解决别名引用@/api/user报错找不到相应的模块
解决方法
1、安装 “@types/node” 模块，用于处理别名不生效问题
npm i @types/node -D
在vite.config.ts中配置别名
import { defineConfig } from 'vite'
import path from 'path'
import vue from '@vitejs/plugin-vue'
// https://vite.dev/config/
export default defineConfig({
plugins: [vue()],
base: '/',
resolve: {
alias: {
'@': path.resolve(__dirname, './src')
},
extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
}
})
1、配置tsconfig.json文件解决找不到模块的问题
这里有个区别，如果tsconfig.json内容是：
{
"files": [],
"references": [
{ "path": "./tsconfig.app.json" },
{ "path": "./tsconfig.node.json" }
],
}
那就需要在tsconfig.app.json中添加
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["src/*"]
},
},
"include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"]
}
这样就可以正常应用了