VSCode HTML标签自动闭合需同时满足:settings.json中"html.autoClosingTag"为true(默认启用)、右下角语言模式确为HTML、禁用Auto Close Tag插件;输入<div>后直接敲>才可验证,改配置后须全窗口重启。

确认 html.autoClosingTag 是否真启用
VSCode 默认就开着 HTML 标签自动闭合,但很多人改过设置或装了插件,导致它被悄悄关掉。别信 GUI 界面里那个勾选框——它可能只是缓存状态。直接打开 Preferences: Open Settings (JSON),搜 "html.autoClosingTag" 这一行:
• 如果存在且值为 false,删掉这行或改成 true
• 如果压根没这行,说明是默认值 true,不用动
• 如果同时存在 "html.autoClosingTag": true 和 "html.autoClosingTag": false(比如全局和工作区配置冲突),后者会生效,得删掉冲突项
右下角语言模式必须是 HTML
这是最常被忽略的硬性前提:
• 新建文件未保存时,默认是 Plain Text,html.autoClosingTag 完全不触发
• 保存为 .html 后,右下角状态栏必须显示 HTML,不是 HTML (EJS)、Vue 或 PHP
• 点击右下角文字可手动切换;如果点开后没有 HTML 选项,检查 files.associations 是否把 *.html 错配成其他语言 ID
• 在 .vue 或 .jsx 文件里,html.autoClosingTag 天然无效——它们的语言 ID 是 vue-html 和 javascriptreact,不是 html
关掉 Auto Close Tag 插件(尤其 VSCode 1.84+)
装了 Auto Close Tag(作者 Jun Han)反而会让自动闭合更不可靠:
• VSCode 1.84 起原生功能已接管,插件会被静默禁用,状态栏看不到图标,但仍在后台加载
• 即使你设了 "auto-close-tag.activationOnLanguage": ["html"],只要 html.autoClosingTag 是 true,插件就不工作
• 更麻烦的是:插件和原生逻辑对 <script></script>、<style></style> 的处理方式不同,容易补错或漏补
• 建议直接卸载该插件,或至少在 settings.json 中加 "html.autoClosingTag": true 并确保插件被禁用
验证是否真生效:输 <div> 后敲 >
别用 Enter 或 Tab 测试,那些行为可能被 Emmet 或 Prettier 劫持:
• 在纯 HTML 文件中,输入 <div>(注意是小于号、字母、大于号)
• 紧接着敲 >,立刻看到补出 </div>,光标停在两个标签之间才算成功
• 如果没反应,检查:
• emmet.triggerExpansionOnTab 是否为 true(它会拦截 >)
• prettier.disableLanguages 是否含 "html"(Prettier 保存时可能删掉自动生成的闭合标签)
• editor.autoClosingBrackets 是否为 "languageDefined"(设成 "always" 可能干扰 HTML 特有逻辑)
html.autoClosingTag 这一对组合,其他都是干扰项。改完 settings.json 后必须全窗口重启,重载窗口(Ctrl+R)不生效。


















