vue.js - vscode js html 等等 不报红了？

Question

如图，红色方块处，js html都不报红。
项目是vue3+ ts
vscode插件用的是vue-official v2.0.28
是还得需要什么配置吗？

---

我目前是把 vue-official 切换到了 v1.8.27 报错提示就有了。但你们有用 v2.0.28 的吗？没有这问题吗？
如图

Answer 1

volar 的类型推断基于 vscode 内置的 typescript-language-features 。首先看下项目里是不是安装了 typescript ，然后看下之前是不是因为 takeover mode 把内置的 typescript-language-features 关了。然后 2.0 以上的 volar 不需要 vue.vscode-typescript-vue-plugin 了。

配置正确的话，vscode 右下角应该会显示 vue 的信息

Answer 2

在Visual Studio Code（VSCode）中，如果JavaScript（JS）或HTML代码不再显示语法错误提示（即“报红”），这通常与几个可能的原因相关。针对你提到的Vue 3 + TypeScript项目，这里有几个检查和解决步骤：

1. 检查语言服务器：
   确保VSCode正确识别了你的文件类型，并且启用了相应的语言服务。对于Vue 3 + TypeScript项目，VSCode应该能够识别.vue文件中的<script>、<template>和<style>部分，并分别应用JavaScript/TypeScript、HTML和CSS/SCSS/LESS等语言支持。
2. 检查TypeScript配置：
   确保你的tsconfig.json文件配置正确，特别是include和exclude字段，它们决定了哪些文件被TypeScript编译器处理。对于Vue项目，你通常不需要特别修改这些字段来包含.vue文件，但确保没有错误地排除了它们。
3. Vue Language Features (Vetur) vs. Volar：
   从Vue 3和VSCode插件的角度来看，Vue的官方插件已经从Vetur转向了Volar。Volar提供了对Vue 3和TypeScript的更好支持。如果你还在使用Vetur，并且你的项目是基于Vue 3的，建议切换到Volar。你可以在VSCode中安装Volar扩展，并禁用Vetur。
4. 安装并配置Volar：
   如果尚未安装，请在VSCode中安装Volar扩展。安装后，确保你的VSCode设置（settings.json）中启用了Volar，并正确配置了它（如果需要）。
5. 检查VSCode设置：
   确保VSCode的设置没有禁用错误或警告的显示。你可以通过命令面板（Ctrl+Shift+P）搜索“settings”来访问设置，并查找与错误提示相关的选项。
6. 重启VSCode：
   有时候，简单的重启VSCode可以解决缓存或配置未更新的问题。
7. 检查控制台和输出面板：
   查看VSCode的“输出”面板（通过点击底部栏的“输出”图标或Ctrl+Shift+U），特别是“TypeScript”或“Vue Language Server”相关的部分，看是否有错误或警告信息。
8. 确保文件被保存：
   确保你的文件已经被保存，因为某些错误提示只有在文件被保存后才会显示。

如果上述步骤都不能解决问题，你可能需要查看VSCode的社区或官方文档，或者搜索是否有其他开发者遇到了类似的问题。