vue3项目运行正常但vscode红色波浪线报错
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue
免费下载资源
·
以下解决办法如不生效,可尝试 重启
vscode
一、Vetur插件检测问题
vetur
是一个vscode
插件,用于为.vue
单文件组件提供代码高亮以及语法支持。- 但
vue
以及vetur
对于ts
的支持,并不友好。
1、原因
- 如下图:鼠标放到红色波浪线处,出现提示小框,箭头所指有
Vetur
关键字,说明是这个插件的语法检测问题。
2、解决方法
- 禁用
Vetur
插件 - 安装
Vue-Official
插件,原名Volar
- 两个插件若同时存在,会冲突,若都不存在,则不会进行语法检测
注意: 安装这个插件时,当前工作区如果是V3
的项目,还是要 “禁用” Vetur
以避免冲突。同理,要是工作区V2
的,最好也 “禁用” Vue-Official
。
二、ts
不识别导入报错的问题
1、原因
- 如下图:鼠标放到红色波浪线处,出现提示小框,箭头所指有
ts
关键字,说明是TS
未识别到相应函数。
TS
未识别到相应函数的原因:项目使用了自动导入插件unplugin-auto-import
,且 没有相应的模块声明文件
2、解决方法
(1)第一种情况
- 在
tsconfig.json
中引入auto-imports.d.ts
文件 *.d.ts
表示所有的.d.ts
文件- 需满足
tsconfig.json
和auto-imports.d.ts
文件都在
项目根目录, - 若不满足,视情况在
tsconfig.json
中修改
// tsconfig.json
{
"include": [
"*.d.ts",
],
}
(2)第二种情况
- 如果
tsconfig.json
中内容如下:
{
"files": [],
"references": [
{
"path": "./tsconfig.node.json"
},
{
"path": "./tsconfig.app.json"
},
{
"path": "./tsconfig.vitest.json"
}
]
}
- 则在
tsconfig.app.json
中引入auto-imports.d.ts
文件 *.d.ts
表示所有.d.ts
文件
// tsconfig.app.json
{
"include": [
"*.d.ts",
],
}
(3)第三种情况
- 若以上两种都不满足,查看博文 Vue3+Vite项目按需自动导入配置以及一些常见问题修复
- 找到如下图所在位置,后面有解决方法说明
GitHub 加速计划 / vu / vue
207.54 K
33.66 K
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:2 个月前 )
73486cb5
* chore: fix link broken
Signed-off-by: snoppy <michaleli@foxmail.com>
* Update packages/template-compiler/README.md [skip ci]
---------
Signed-off-by: snoppy <michaleli@foxmail.com>
Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 4 个月前
e428d891
Updated Browser Compatibility reference. The previous currently returns HTTP 404. 5 个月前
更多推荐
已为社区贡献3条内容
所有评论(0)