VSCode 1.40+ 内置 Emmet，输入 ! 按 Tab 生成 HTML5 骨架需满足三条件：右下角语言模式为 HTML、文件已保存、光标在空行或标签外；属性值须双引号、禁空格；JSX/Vue 需配置 emmet.includeLanguages。
VSCode 从 1.40 版本起已内置 Emmet，不用装插件、不改默认设置，只要文件是 .html 后缀且语言模式为 HTML，输入缩写按 Tab 就能展开——卡住的几乎全是环境或触发条件问题，不是语法不会。
为什么输入 ! 没反应？检查这三处
输入 ! 后按 Tab 应该立刻生成完整 HTML5 骨架，没反应时优先排查：
- 右下角语言模式是否显示
HTML？显示Plain Text或JavaScript就无效，点击切换 - 文件是否已保存？未保存的临时文件常被识别为 Plain Text
- 光标是否在空行或标签外部？写在
<div>里面或</body>后面都不会触发
注意：html:5 和 html5 已废弃，只认 !；生成的 <html lang="en"> 如需中文，手动改成 lang="zh-CN" 即可。
div.container>ul>li*3 展不开？确认触发键和上下文
多层嵌套缩写依赖正确触发方式和编辑位置：
立即学习“前端免费学习笔记（深入）”；
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 必须按
Tab，不是Enter—— VSCode 默认只响应Tab触发 Emmet 展开 - 光标不能卡在属性值内，比如
<div class="|"这里按Tab会补全 class 名，不是展开缩写 - 确保不在
<script>或<style>块中使用，Emmet 只作用于模板上下文 - 若仍失灵，检查
settings.json中是否有"emmet.triggerExpansionOnTab": false，该值必须为true
常见缩写符号：> 表示父子，+ 表示兄弟，* 控制重复次数，$ 支持自增编号（如 li.item$*3）。
input[type="text"] 不生效？属性写法有硬性要求
Emmet 对属性语法很敏感，错一个字符就可能静默失败：
- 属性值必须用英文双引号包裹：
input[type="text"]✅，input[type=text]❌ - 等号前后不能有空格：
a[href= "#home"]❌，a[href="#home"]✅ - 多个 class 用点连写：
div.box.rounded→<div class="box rounded">，不支持空格或逗号 - id 必须用
#开头，且只能有一个：div#app.container合法，div#app#main会出错
带文本内容用花括号：h2{标题}，多个元素间文本要分别加括号，如 div>p{第一段}+p{第二段}。
JSX/Vue 文件里缩写失效？得配 includeLanguages
Emmet 默认只对 .html 和 .css 文件启用，JSX/TSX/Vue 模板需手动声明：
- 打开
settings.json，添加："emmet.includeLanguages": {"javascript": "javascriptreact", "vue": "html"} - Vue 单文件组件中，
<template>区域直接可用，但<script>和<style>区域需对应设为javascript或css模式 - 远程开发（WSL/SSH）时，这些配置必须在远程环境的
settings.json里单独设置，本地配置不继承 - 如果用了主题插件（如 emerald），它可能覆盖 Emmet 的 snippet 优先级，建议禁用后重启
真正卡住的往往不是缩写记不住，而是语言模式没切对、Tab 被其他补全劫持、或者某个插件悄悄关掉了 emmet.triggerExpansionOnTab。先看右下角，再查设置，比重装插件快得多。
