Auto Close Tag 不生效是因 VSCode 1.84+ 内置 html.autoClosingTag 默认开启,需在 settings.json 中设为 false 并全窗口重启;script/style 不闭合因插件跳过允许自闭合的标签,启用 SublimeTextMode 可解决;.vue/.jsx 需添加 activationOnLanguage 支持;光标卡顿或缩进错乱源于 editor.formatOnType 与插件冲突,应关闭并设固定 tabSize。

Auto Close Tag 不生效?先关掉 VSCode 内置的 html.autoClosingTag
VSCode 1.84+ 版本默认开启内置标签闭合,它会静默接管所有 HTML 文件的闭合逻辑,导致 Auto Close Tag 插件完全不响应——状态栏右下角看不到 ACT 图标,敲 <div> 也没反应。
必须手动禁用内置功能:
- 打开命令面板(
Cmd + Shift + P或Ctrl + Shift + P)→ 输入Preferences: Open Settings (JSON) - 在
settings.json中添加:"html.autoClosingTag": false - 保存后**全窗口重启 VSCode**(仅重载窗口无效)
这是 90% 用户装了插件却“没效果”的根本原因,不是插件没装对,是 VSCode 自己先占了位置。
为什么 <script> 和 <style> 不自动闭合?开 SublimeTextMode
插件默认只处理语义明确的成对标签(如 <div>、<p>),而 <script> 和 <style> 在 HTML 规范中允许自闭合写法(<script/>),所以被跳过。
立即学习“前端免费学习笔记(深入)”;
要强制补全,需启用更激进的匹配模式:
- 在
settings.json中添加:"auto-close-tag.SublimeTextMode": true - 该模式以输入
</为触发点,主动推断并补全标签名(比如输</就弹出</script>) - 必须配合
"html.autoClosingTag": false使用,否则两者逻辑冲突
注意:<img>、<input> 等真自闭合标签仍不会多出 </img>,插件的语义识别是可靠的。
.vue 和 .jsx 文件里标签不闭合?改 activationOnLanguage
VSCode 把 .vue 文件整体识别为 vue 语言,把 .jsx 识别为 javascriptreact,而 Auto Close Tag 默认只监听 html 类型。
需显式声明支持范围:
- 在
settings.json中添加:"auto-close-tag.activationOnLanguage": ["html", "vue", "javascriptreact"] -
javascriptreact是 VSCode 对 JSX 的内部语言 ID,别写成jsx或react - Vue 单文件组件中,只有
<template lang="html">块内才生效;若写了lang="pug"或lang="ts",插件不介入
JSX 标签闭合建议交给 TypeScript 或 ESLint + Prettier 校验,Auto Close Tag 不处理 JavaScript 语法层的标签结构。
补全后光标卡住或缩进错乱?关掉 editor.formatOnType 并设固定 tabSize
典型现象:输完 <div> 回车,光标停在 </div> 里面;或者自动多缩进一层。这不是插件 bug,是它和格式化策略打架的结果。
关键干预点:
- 关闭自动格式化:
"editor.formatOnType": false(尤其搭配 Prettier 时) - 设固定缩进宽度:
"editor.tabSize": 2(别用"auto",不同文件缩进逻辑不一致) - 禁用干扰性 Emmet 设置:
"emmet.triggerExpansionOnTab": false(避免 Tab 键被多重劫持)
最易被忽略的是 formatOnType —— 它会在你敲下 > 的瞬间触发格式化,把刚生成的闭合标签顶到错误位置,表面像插件问题,实则是配置冲突。



















