未启用Auto Close Tag扩展会导致HTML/XML结束标签需手动输入,应安装Jun Han开发的Verified插件,配置autoCloseTag.activationOnLanguage为["html","xml"],禁用editor.autoClosingTags,调整Prettier与Emmet设置,并在settings.json中启用SublimeTextMode及enableAutoCloseTagWithOutSelect。

如果您在使用 VSCode 编写 HTML 或 XML 代码时,频繁手动输入结束标签,导致效率下降或标签嵌套错位,则可能是未启用或未正确配置 Auto Close Tag 扩展。以下是启用与优化该功能的具体操作步骤:
本文运行环境:MacBook Air,macOS Sequoia。
一、安装 Auto Close Tag 扩展
Auto Close Tag 并非 VSCode 内置功能,需通过扩展市场安装官方认证的插件以实现自动闭合标签能力。
1、打开 VSCode,点击左侧活动栏中的扩展图标(四个方块组成的图标)。
立即学习“前端免费学习笔记(深入)”;
2、在扩展搜索框中输入 Auto Close Tag。
3、在搜索结果中找到作者为 Jun Han 的扩展,确认其标识为 Verified Publisher。
4、点击“安装”按钮,等待安装完成。
二、启用 HTML/XML 自动闭合规则
该扩展默认仅对部分语言启用,需手动配置以确保在 HTML 和 XML 文件中生效。
1、按下 Cmd + ,(macOS)打开设置界面。
2、在右上角搜索框中输入 autoCloseTag.activationOnLanguage。
3、点击编辑按钮,在数组中添加 "html" 和 "xml" 两项。
4、保存设置后重启 VSCode 窗口。
三、禁用与其他扩展的冲突行为
部分格式化扩展(如 Prettier)可能覆盖 Auto Close Tag 的自动插入逻辑,需调整优先级或关闭冗余功能。
1、进入设置界面,搜索 editor.autoClosingTags。
2、将内置的 VSCode 标签自动闭合选项设为 false,避免双重触发。
3、在设置中搜索 prettier.bracketSameLine,确认其值不强制修改标签换行结构。
4、检查已启用的 Emmet 相关设置,确保 emmet.triggerExpansionOnTab 未干扰标签补全流程。
四、自定义闭合触发条件
可通过修改用户设置 JSON,精确控制哪些字符触发闭合行为,提升编码精准度。
1、按下 Cmd + Shift + P,输入并选择“Preferences: Open Settings (JSON)”。
"auto-close-tag.SublimeTextMode": true
"auto-close-tag.enableAutoCloseTagWithOutSelect": true
3、保存文件后,输入











