1.配置原因
在v3+ts的项目中,vscord不认识@符号
因为为了让vscode认识@符号并提出提示
2.配置步骤 分为2步
1.在tsconfig.json中添加
{
"compilerOptions": {
// ...
"baseUrl": ".",
"paths": {
"@/*": ["src/*"]
}
}
}
2.核心步骤:
1.添加配置
在vite.config.ts中添加配置
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// 这里使用nodejs的模块,可能会报错,需要安装node的类型声明文件
const path = require('path')
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': path.resolve(__dirname, './src')
}
}
})
2.安装包
npm i @types/node -D 或 yarn add @types/node -D
注意:修改完 vite.config.ts 文件需要重启vscord
注意,在这个过程在会报下面这个错误
不支持“path”的动态要求
我自己在那研究了老半天,用很简单的方法解决了
在 vite.config.ts文件中 把const path = require('path') 注释 ,引入 import path from 'path'
这个方法,是我自创的,有误的话,欢迎大家提出更宝贵的意见