需启用 "html.suggest.html5": true 并配置 files.associations 和 html.customData，才能在 type="|" 等属性引号内显示标准及自定义值建议。
input type="|" 引号内不提示？先确认 HTML5 补全已启用
VS Code 默认不会在 type、autocomplete、inputmode 等属性的引号内弹出合法值列表，除非显式开启 HTML5 语义补全。这不是 bug，是语言服务的默认保守策略。
打开 settings.json，确保包含这一行：
"html.suggest.html5": true
这个配置告诉 VS Code 的 HTML 语言服务器：别只认 class/id，要按 W3C HTML5 规范解析 input、button、textarea 等标签的属性值域。比如 type="|" 光标停在引号中时，会列出 text、email、date、color 等 18 个标准值，而非空列表或仅匹配你已输过的字母。
- 如果用了 Vue 单文件组件，还需加
"files.associations": { "*.vue": "html" }，否则<template></template>里的input不走 HTML 语言服务 - 禁用冲突插件（如某些“HTML Tools”旧版）——它们可能劫持
onDidProvideCompletionItems钩子，导致标准补全被吞掉 - 重启 VS Code 后，新开一个
.html文件测试，不要在未保存的 Untitled-1 中验证，那里语言模式可能仍是 plain text
Emmet 补全和语言服务补全不是一回事
很多人混淆了两种补全：一种是输入 div.container 按 Tab 展开为 <div class="container"></div>（Emmet），另一种是输入 type="|" 后弹出取值菜单（HTML 语言服务）。它们触发机制、配置项、甚至底层协议都不同。
立即学习“前端免费学习笔记（深入）”；
关键区别：
- Emmet 补全靠
emmet.triggerExpansionOnTab控制，只响应 Tab 键；语言服务补全默认响应.、=、引号内空格等上下文，且支持鼠标悬停查看 MDN 文档链接 - Emmet 对
type="text"这类已有值不干预；语言服务会在你删掉text、光标回到引号中间时立刻刷新建议列表 - 若关闭
editor.suggest.snippetsPreventQuickSuggestions（设为false），Emmet 片段才不会压制语言服务的属性值建议
Vue / JSX 中 HTML 补全失效？检查 language ID 和嵌套层级
在 .vue 文件里写 <input type="|"> 没反应，大概率是语言模式没对上，或者光标位置不在语言服务能解析的 AST 节点内。
验证步骤：
- 把光标放在
type="|"引号中，按Ctrl+Shift+P输入Developer: Inspect Editor Tokens and Scopes，看右下角显示的languageId是不是html（不是vue或vue-html） - 如果显示
vue-html，说明 Emmet 已接管，但 HTML 语言服务没挂载——此时必须配"files.associations": { "*.vue": "html" }，强制整个文件走 HTML 服务 - JSX 中（如
.tsx）更麻烦：<input type="|"> 可能被 TypeScript 语言服务拦截，需安装 <code>ESLint+Prettier插件并启用typescript.preferences.includePackageJsonAutoImports，否则 AST 解析会跳过 JSX 属性值
自定义补全值（比如团队私有 type="search-bar"）怎么加？
W3C 标准里没有 search-bar，但你项目里用了，又不想每次手打，就得扩展语言服务的值域。VS Code 不支持直接改内置 schema，但可通过插件注入。
最轻量的做法是用 html.customData：
"html.customData": ["./html-data.json"]
然后在项目根目录建 html-data.json，内容类似：
{
"version": 1.1,
"tags": [],
"attributes": [
{
"name": "type",
"valueSet": "input-type"
}
],
"valueSets": [
{
"name": "input-type",
"values": [
{ "name": "search-bar", "description": "自定义搜索组件" },
{ "name": "range-slider", "description": "带刻度的范围选择器" }
]
}
]
}
注意：html.customData 只影响当前工作区，且必须是相对路径；如果路径错、JSON 格式错、或 valueSet 名拼错，补全就静默失败，不会报错提示。
真正容易被忽略的是：这类自定义值不会出现在 Emmet 补全里，也不会触发 onDidChangeTextDocument 的校验逻辑——它纯粹是语言服务的“只读词典”，拼错照样能保存、编译、运行，只是 IDE 不提醒。
