HTML 可以说是前端中最为基础的技术之一，然而在开发过程中，经常会遇到有关 HTML 的问题，如标签未正确闭合、class 命名规范等等，这些问题如果不得当处理，可能就会导致页面出现问题或者编写出风格混乱的代码，让维护变得更为困难。
为了规范 HTML 的编写过程，现有一个叫做 HTML Validate 的工具，它可以检查 HTML 代码是否符合规范，并提示开发者进行修改。这个工具与 ESLint 结合使用，可以更好地帮助前端工程师保持代码的高质量。
本文介绍的是一款叫做 @html-validate/eslint-config 的 npm 包，它是专门为 ESLint 定制的配置文件，可以用于检查 HTML 代码中的语法、标签等问题，下面我们就来介绍一下如何使用这款包。
步骤一：安装 @html-validate/eslint-config
在命令行窗口中，输入以下命令，即可安装这个包：
npm install @html-validate/eslint-config --save-dev
步骤二：配置 .eslintrc 文件
安装完这个包之后，我们还需要在项目中的 .eslintrc 文件中添加以下内容：
{
"extends": ["@html-validate/eslint-config"]
}这样，我们的 ESLint 就会自动使用这个配置文件，对代码进行规范化检查了。
步骤三：运行 ESLint
一旦设置了 .eslintrc 文件，我们就可以在命令行窗口中使用如下命令检查 HTML 代码：
eslint yourfile.html
这里的 yourfile.html 是你要检查的文件名，你也可以使用通配符来检查指定目录下的所有 HTML 文件。
示例代码
下面是一个示例代码，用于演示如何使用这个包：
-- -------------------- ---- ------- --------- ----- ----- ---------- ------ ----- ---------------- ------------ ------------- ------- ------ ----------------- ------------------------------------------------- ------- -------
运行 ESLint 检查这段代码，你会发现它并没有问题，因为它符合 HTML 的语法规范。
结论
使用 @html-validate/eslint-config 包可以更好地规范 HTML 代码的编写，使得代码更加优美、易于维护。同时，这个包的使用，也是前端工程师不断提高自身编码水平的一种方式。希望本文对你有所帮助，谢谢！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f144500403f2923b035c2e2