Javascript 如何启用 VS Code HTML 错误检查/验证?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/44559598/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to enable VS Code HTML error checking / validation?
提问by Marc
I have just switched to Visual Studio Code for web development from Netbeans and am finding my way around. In Netbeans, if I forget the closing bracket on a tagname it will indicate my error with a red squiggly underline, and the alert in the left margin.
我刚刚从 Netbeans 切换到 Visual Studio Code 进行 Web 开发,并且正在寻找解决方法。在 Netbeans 中,如果我忘记了标记名上的结束括号,它将用红色波浪线下划线指示我的错误,并在左边距中显示警告。
I would have thought error checking to be a fundamental function in a web dev editor like vs code. Maybe I am just not finding the right option or extension.
我会认为错误检查是像 vs 代码这样的 Web 开发编辑器中的基本功能。也许我只是没有找到正确的选项或扩展。
How can I achieve this same html, css error checking behaviour in VS Code?
如何在 VS Code 中实现相同的 html、css 错误检查行为?
回答by Nimeshka Srimal
VSCode doesn't have HTML validation by default. But it allows you to add extensions and enable these features.
默认情况下,VSCode 没有 HTML 验证。但它允许您添加扩展并启用这些功能。
To add HTML validation (linting), Open VSCode, then press Ctrl + Pand then paste ext install HTMLHintin it, and press enter. It will install a HTML validator. You may need to reload VSCode to load the extension.
要添加 HTML 验证(linting),请打开 VSCode,然后按Ctrl + P然后粘贴ext install HTMLHint进去,然后按 Enter。它将安装一个 HTML 验证器。您可能需要重新加载 VSCode 以加载扩展。
Now if you open the same html document you had the syntax error, you should see there's an issue shown at the status bar at the bottom :) and it will also show you the errors in those lines.
现在,如果您打开出现语法错误的同一个 html 文档,您应该会看到底部状态栏中显示一个问题 :) 并且它还会向您显示这些行中的错误。
回答by eigenharsha
VS Code default support code formatting and it track the syntactical error. If you create a new file and directly try to write the code than VS Code could not able to understand which language or type of syntax user want to format/correcting. So, first need to save the new file with the proper extension than visual studio properly identify the syntax.
VS Code 默认支持代码格式化并跟踪语法错误。如果您创建一个新文件并直接尝试编写代码,那么 VS Code 将无法理解用户想要格式化/更正哪种语言或语法类型。因此,首先需要使用正确的扩展名保存新文件,而不是 Visual Studio 正确识别语法。
The code formatting is available in VS Code through the following shortcuts:
VS Code 中的代码格式可通过以下快捷方式获得:
- On Windows Shift+ Alt+ F
- On Mac Shift+ Option+ F
- On Ubuntu Ctrl+ Shift+ I
- 在 Windows Shift+ Alt+ 上F
- 在 Mac Shift+ Option+F
- 在 Ubuntu Ctrl+ Shift+I
You can add Auto Close Tagfrom VS Code marketplace.
您可以Auto Close Tag从 VS Code 市场添加。
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
启动 VS Code 快速打开 (Ctrl+P),粘贴以下命令,然后按 Enter。
Automatically add HTML/XML close tag, same as Visual Studio IDE or Sublime Text
ext install auto-close-tagVS Code integration for HTMLHint - A Static Code Analysis Tool for HTML
ext install HTMLHintProvides CSS class name completion for the HTML class attribute based on the CSS files in your workspace. Also supports React's className attribute.
ext install html-css-class-completion
自动添加 HTML/XML 关闭标签,与 Visual Studio IDE 或 Sublime Text 相同
ext install auto-close-tagHTMLHint 的 VS Code 集成 - HTML 的静态代码分析工具
ext install HTMLHint根据工作区中的 CSS 文件为 HTML 类属性提供 CSS 类名补全。还支持 React 的 className 属性。
ext install html-css-class-completion
回答by Ganesh
The VS Code supports this by default. It also has Emmet support enabled by default which means you don't need to worry about close HTML tags. It automatically adds closing tag.
VS Code 默认支持这个。它还默认启用 Emmet 支持,这意味着您无需担心关闭 HTML 标签。它会自动添加结束标记。
回答by Ganesh
This is not a builtin functionality of VsCode...However, it has a lot of plugins available. I would recommend you the HTMLHint plugin. That's what I have been using.
这不是 VsCode 的内置功能……但是,它有很多可用的插件。我会向您推荐 HTMLHint 插件。这就是我一直在使用的。
You can install it using: ext install HTMLHintcommand
您可以使用以下ext install HTMLHint命令安装它:
回答by ChekTek
I found that this extension (while not letting you extend the built in rules) works better than HTMLHint for checking HTML validity.
我发现这个扩展(虽然不让你扩展内置规则)在检查 HTML 有效性方面比 HTMLHint 效果更好。
Name: W3C Validation
名称:W3C 验证
Id: umoxfo.vscode-w3cvalidation
id:umoxfo.vscode-w3cvalidation
Description: Adds W3C validation support to Visual Studio Code.
描述:向 Visual Studio Code 添加 W3C 验证支持。
Version: 2.3.0
版本:2.3.0
Publisher: Umoxfo VS
出版商: Umoxfo VS
Marketplace Link: https://marketplace.visualstudio.com/items?itemName=umoxfo.vscode-w3cvalidation
市场链接:https: //marketplace.visualstudio.com/items?itemName=umoxfo.vscode-w3cvalidation
回答by Riswan
There is an extension for VS Code which is HTMLHint.
You can install that by following the below
1. To open the extensions:marketplace press Ctrl+ Shift+ X
2. Type HTMLHint in the search extension box
3. Click on the install button in the search result showing HTMLHint developed by "Mike Kaufman"
VS Code 有一个扩展名为 HTMLHint。
您可以按照以下步骤进行安装
1. 要打开扩展:marketplace 按Ctrl+ Shift+ X
2. 在搜索扩展框中键入 HTMLHint
3. 单击搜索结果中的安装按钮,显示由“Mike Kaufman”开发的 HTMLHint

