VSCode HTML无自动补全主因是语言模式错误、html.suggest.html5未启用或Emmet触发条件不满足;需先确认右下角为HTML模式,再开启html.suggest.html5,最后确保emmet.triggerExpansionOnTab为true并用Tab键展开。

VSCode 编辑 HTML 没有自动补全提示,90% 不是插件坏了,而是语言模式没识别、关键配置被关掉,或 Emmet 触发条件不满足——直接按下面几条查,基本立竿见影。
右下角状态栏不是 HTML?立刻切语言模式
这是最常被忽略的第一步。VSCode 的 HTML 补全只在 html 语言模式下激活,其他模式(如 Plain Text、PHP、JavaScript)压根不加载 HTML 语言服务。
- 点击右下角状态栏的语言标识(比如显示
Plain Text或PHP),选 Configure File Association for '.xxx' → 设为HTML - 如果文件还没保存,新建后默认是
Plain Text,必须先保存为.html后缀,或手动用Cmd+Shift+P→ 输入Change Language Mode→ 选HTML - 在
.vue、.jsx文件里写 HTML?原生不支持,得靠插件(如 Volar)或手动加files.associations映射
html.suggest.html5 被关了?必须设为 true
这个开关控制所有标准 HTML5 标签(section、article、input 等)和全局属性(onclick、draggable)的补全是否出现。关掉它,补全列表只剩 Emmet 缩写,连 div 都不会提示。
- 打开设置(
Cmd+,),搜索html.suggest.html5,确保勾选 - 或在
settings.json中确认有这一行:"html.suggest.html5": true - 注意:它和
html.autoClosingTag无关,后者只管闭合标签,不管补全提示
Emmet 缩写(如 div.container)按 Tab 没反应?检查两个硬性条件
Emmet 是 VSCode HTML 补全的主力引擎,但它不“智能感知”,只响应明确触发信号。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面,使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力: - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面; - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”; - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记(深入)”;
-
emmet.triggerExpansionOnTab必须为true(GUI 设置里叫 “Emmet: Trigger Expansion On Tab”) - 输入缩写后必须**紧跟 Tab 键**——按 Enter 是换行,按 Space 是插入空格,都不触发展开
- 验证是否正常:新建
test.html,输入!+Tab,能生成完整 HTML5 模板就说明 Emmet 本身没问题 - 在非
.html文件(如.md)中想用 Emmet?加配置:"emmet.includeLanguages": {"markdown": "html"}
input type="|" 里不提示枚举值?这不是原生功能
VSCode 原生 HTML 语言服务对 type、autocomplete、loading 这类语义化属性的取值不做枚举提示——它把 type="text" 当作普通字符串处理,而非结构化字段。
- 要获得
type="date"、type="email"这类补全,需安装额外插件,例如 Auto Close Tag(基础)或更专业的 HTML Boilerplate 类扩展 - 或者启用实验性设置:
"html.suggest.experimental.customHtml5": true(仅部分 VSCode 版本支持,且不稳定) - 别指望 class 属性里自动提示项目 CSS 类名——那是另一个功能,需单独装
IntelliSense for CSS class names in HTML并配好css.styleSheets
真正容易被绕进去的点是:把“自动闭合标签”“括号配对”“Emmet 展开”“属性枚举提示”当成一回事。它们由完全不同的配置项和语言服务模块控制,混着调只会越调越乱。每次只动一个变量,验证后再下一步。


















