VSCode怎么设置自动关闭空标签_VSCode自闭合标签与结束标签补全
vscode不为补是遵循html5规范的正确行为，因属void element（空元素），语法禁止闭合；自动闭合仅针对可嵌套容器标签（如、），而和需启用auto close tag的sublimetextmode才支持。
VSCode 默认不自动补全自闭合标签（如 <img>、<input>），它只对容器标签（如 <div>、<code><p></p>）做自动闭合；所谓“自动关闭空标签”是误解，空元素本就不该有闭合标签。
为什么输入 <img> 后不会补
这不是 bug，而是 HTML 规范和 VSCode 行为的一致性体现：<img> 是 void element（空元素），语法上禁止闭合。VSCode 的 html.autoClosingTag 机制严格遵循 HTML5 标准，只对可包含子内容的元素生成结束标签。
常见被误认为“该闭合却没闭合”的标签包括：<br>、<hr>、<meta>、<link>、<input>、<img>、<area>、<col>、<embed></embed>、<keygen></keygen>、<param>、<source></source>、<track></track>、<wbr></wbr> —— 它们在任何模式下都不会触发自动闭合。
- 即使你手动写成
<img> 或 <img>，Prettier / HTMLHint 等工具也会在保存时修正为 <img>
- 强行补
- VSCode 原生行为、Auto Close Tag 插件、Volar 等均不支持也不允许对此类标签补结束符
html.autoClosingTag 只对哪些标签生效？
它仅作用于 可嵌套、可含子节点 的元素，典型如：
<section></section>、<article></article>、<header></header>、<main></main>、<footer></footer>
<p></p>、<span></span>（注意：<span></span> 在某些旧版语言服务中可能不触发，但 1.84+ 已稳定支持）
符合 Custom Elements 规范的自定义标签，如 <my-button></my-button>（前提是语言模式识别为 HTML 或 vue-html）
关键判断逻辑是：VSCode 解析到开始标签后，查 HTML5 DTD 判定是否为 void 或 rawtext 类型——只有 normal 类型才参与自动闭合。
VSCode
避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。
下载
想让 <script></script> 或 <style></style> 自动补闭合？得开 SublimeTextMode
原生 html.autoClosingTag 默认不处理 <script></script> 和 <style></style>，因为它们属于“可含 CDATA 内容”的特殊容器，VSCode 将其视为潜在嵌套风险区域而保守处理。
若你确实需要这类补全（比如写内联脚本/样式），可通过 Auto Close Tag 插件启用：
- 确保已安装
Auto Close Tag（Jun Han 版）
- 在
settings.json 中添加："auto-close-tag.SublimeTextMode": true
- 同时确认：
"auto-close-tag.activationOnLanguage": ["html", "vue", "xml"]
- 重启窗口或重载设置后，输入
<script></script> + Enter 或 > 即可补
⚠️ 注意：SublimeTextMode 会放宽闭合策略，可能在非预期位置补全（如字符串内），慎用于复杂模板文件。
Vue/JSX 中的空标签和闭合行为完全不同
.vue 文件的 <template></template> 区域由 Volar 提供语言服务，它默认启用 html.autoClosingTag 的等效逻辑，但规则更严格：
-
<img>、<input> 等仍不补闭合标签（正确）
-
<mycomponent></mycomponent>（首字母大写）会被识别为自定义组件，默认按容器处理 → 补
-
<my-component></my-component>（短横线命名）需在 compilerOptions.isCustomElement 中显式声明，否则可能不触发闭合
- JSX 文件（.jsx/.tsx）完全不走 HTML 语言服务，必须靠 ESLint + TypeScript Server 或插件（如 Auto Rename Tag）辅助，原生无自动闭合
最容易忽略的一点：Volar 启动失败时（比如和残留的 Vetur 冲突），<template></template> 区域会退化为 plain text 模式，此时所有自动闭合、高亮、提示全部失效——务必检查 Developer Tools Console 是否有 Volar: failed to activate 报错。
