Sublime Text 如何查找未闭合的 HTML 标签？实用排查技巧
Sublime 里怎么快速定位未闭合的 HTML 标签？
坦白说，Sublime Text 本身并没有内置一个专门的“标签匹配校验”功能。但这不代表我们只能束手无策。核心思路是，别被动等待浏览器报错，而是主动让编辑器帮你暴露结构上的断裂点。常用的方法，是结合高亮配对和插件辅助，快速揪出那些漏了闭合的 或 。
编辑器默认开启的 Bracket Highlighter（括号高亮）会同步高亮成对的 < 和 > 符号，不过它对复杂的嵌套标签就不太敏感了。一个更直接的技巧是：把光标停在某个起始标签上，然后立刻瞥一眼右下角的状态栏。如果那里显示类似“tag: div (unclosed)”的提示，那就说明Sublime检测到它可能没闭合。当然，这个自带的检测机制比较基础，有几点需要注意：
- 状态栏没提示，不一定就万事大吉。如果漏闭合的标签离得太远，这个检测可能会失效。
- 代码里如果有多层嵌套，或者混用了模板语法（比如
<%= ... %>），这个提示也经常不准。 - 最基础的一步，务必确认当前文件的语法高亮是正确的。通过
View → Syntax → HTML确保Sublime把它识别为HTML文件，否则连基础的高亮都可能出错。
推荐装什么插件来查未闭合标签？
如果想更省力，插件自然是首选。虽然 HTML-CSS-Class-Completion 这类插件附带了轻量检查，但更推荐单独安装一个名为 Tag（作者：sublimator）的插件。它的好处是专注且轻量，不改变原有的语法高亮，只在需要时扫描并精准报错：
- 安装后，通过
Ctrl+Shift+P调出命令面板，输入Tag: Validate即可手动触发检查。 - 它支持自定义忽略列表，像
- 报错信息非常清晰，格式类似
Unclosed tag 'div' at line 42, column 8，点击就能直接跳转到问题行。 - 需要留意的是，它只检查标签结构是否闭合，对于标签属性里的引号是否配对，它就无能为力了。
为什么有时候“高亮配对”看起来正常，实际却漏闭合了？
这个问题坑过不少人。明明编辑器里的标签颜色都一一对应，高亮看起来完美无缺，可一到浏览器就渲染得乱七八糟。其实，常见原因往往是标签被“藏”起来了——比如被注释、Ja vaScript字符串或者服务器端代码包裹，导致Sublime的语法解析器中途“迷路”。来看个典型例子：
在上面这段代码里，那个写在Ja vaScript字符串中的 ，会被Sublime误判为真实的DOM标签，从而彻底打乱后续的配对逻辑。这时候，编辑器里的高亮看起来可能依然“和谐”，但浏览器解析时结构已经崩了。
- 遇到这种疑案，最笨但有效的方法就是手动搜索。用
Ctrl+F逐个查找 - 也可以换个思路，直接搜索
，看看闭合标签的数量和起始标签是否大致匹配（记得排除自闭合标签）。 - 如果你的项目使用了Django、Jinja这类模板引擎，那么最好的做法是优先利用服务端模板的校验功能，别把希望全押在前端编辑器上。
保存时自动检查未闭合标签可行吗？
当然可行，这算是终极懒人方案了。不过，实现它需要一点配置功夫。通常的搭配是 SublimeLinter 加上 SublimeLinter-html-tidy 这个插件。但这里有个前提：tidy 本身是一个命令行工具，你需要先在系统层面安装好 html-tidy，然后在Sublime里正确配置linter的路径。一旦配置成功，每次保存文件时，编辑器都会自动调用tidy进行检查，并直接抛出类似下面的错误：
line 123 column 10 - Error:is not closed
然而，这种自动化是有代价的。每次保存都会触发一个外部进程，对于小文件来说无感，但如果页面超过500行，可能会感觉到明显的卡顿，大概1到2秒。另外，tidy 默认有自己的一套代码格式化规则，它可能会自作主张地重排你的HTML结构，破坏你原有的缩进和空行风格。
- 因此，一个折中的建议是：在开发过程中，使用手动的
Tag: Validate进行轻量检查；只在最终交付或阶段性整理代码前，才启用这个保存时自动检查的功能。 - 如果你的项目混合使用了Vue或React的JSX语法，
tidy很可能会直接报错。这时候，可能需要临时切换回纯HTML模式再进行校验。 - 对于Mac用户，安装
html-tidy推荐使用Homebrew命令brew install tidy-html5，安装后的路径通常是/usr/local/bin/tidy。
话说回来，工具虽好，也有其边界。真正让开发者头疼的，往往是那些跨文件的模板包含（例如
