VS Code Emmet 怎样按语言条件展开缩写

VS Code 里的 Emmet 不是“所有文件都自动按 HTML 展开”。它先看当前文件的语言模式，再决定是否提供缩写建议。遇到某种模板文件里输入 div>span 没有反应时，通常要把目标语言标识映射到 Emmet 已支持的 html 或 css 模式。

官方地址：https://code.visualstudio.com/docs/languages/emmet

下面只处理语言条件、触发方式和建议范围，不涉及扩展开发或自定义 Snippets。

先确认文件到底使用哪种语言模式

第一步不要直接改配置。打开目标文件，查看窗口右下角的语言模式名称；点击它可以重新选择语言，也可以执行“配置‘某语言’语言设置”进入该语言的专属设置。文件扩展名只是线索，Emmet 实际读取的是 language identifier。

例如，界面上显示的是 Plain Text 时，对应标识通常是 plaintext；如果实际模式是某个模板语言，就应以该模式的标识作为映射左侧。设置编辑器也支持在搜索框输入 @lang:languageId，只查看该语言的设置。

用 emmet.includeLanguages 指定借用的语法

在用户或工作区的 settings.json 中加入映射。左侧是目标语言 identifier，右侧是 Emmet 已支持的模式。下面的示例让 Plain Text 借用 HTML，让 JavaScript 借用 JSX 风格的展开规则：

{
  // 让指定语言模式借用 Emmet 已支持的语法
  "emmet.includeLanguages": {
    // 左侧是当前文件的 language identifier
    "plaintext": "html",
    // JavaScript 文件需要 JSX 风格展开时使用对应映射
    "javascript": "javascriptreact"
  }
}

如果你的目标文件不是 Plain Text，只替换左侧的 plaintext，不要把文件后缀、显示名称和 language identifier 混用。右侧必须是 Emmet 支持的模式，例如 html、css 或文档列出的其它模式。

保存后回到目标文件，输入 ul>li*3。建议列表出现 Emmet 项时，按 Tab 或回车接受；如果只想看建议而不自动用 Tab 展开，可以不打开 Tab 触发选项。

把建议限制在需要的语言范围

映射成功后，Emmet 可能会在非 HTML/CSS 上下文提供建议。若只希望标记语言和样式文件显示建议，可以同时设置：

{
  // 只在标记语言和样式文件中展示展开建议
  "emmet.showExpandedAbbreviation": "inMarkupAndStylesheetFilesOnly",
  // 需要按 Tab 展开时再显式打开，避免把普通缩进误当成缩写
  "emmet.triggerExpansionOnTab": true
}

这两个设置解决的是“在哪里显示”和“是否用 Tab 触发”，并不会改变 includeLanguages 的语言映射。测试时建议只在目标文件中输入一个短缩写，先观察建议列表，再确认展开后的标签层级；不要把“没有建议”直接判断为映射无效，也要排除当前光标是否处在字符串、注释或不支持的上下文。

不生效时按设置作用域回退

VS Code 的设置可能同时存在于用户、工作区和语言专属作用域。先在设置编辑器搜索 emmet.includeLanguages，确认当前工作区没有另一份映射覆盖它；再检查目标文件右下角的语言模式是否正确。

• 完全没有 Emmet 建议：先核对左侧 language identifier，再确认 Emmet 内置扩展没有被禁用。
• 所有文件都出现建议：缩小映射范围，或将 emmet.showExpandedAbbreviation 设为 inMarkupAndStylesheetFilesOnly。
• 按 Tab 只缩进不展开：先看建议列表是否出现；只有出现可接受的 Emmet 建议时，Tab 才有展开目标。
• 改乱了设置：在设置项齿轮菜单选择重置，或删除自己添加的对应键；工作区设置要在当前项目中单独处理。

最小判断可以归纳为：语言模式决定“匹配谁”，emmet.includeLanguages 决定“借用哪种语法”，显示和 Tab 选项决定“在哪里、怎样触发”。把这三层分开检查，通常不需要反复安装扩展。

相关问题

emmet.includeLanguages 左右两边分别写什么？

左侧写当前文件的 language identifier，右侧写 Emmet 已支持的模式。两边都不是随意的中文显示名称。

为什么映射后仍然在注释里出现建议？

映射只建立语法关联，不保证每个上下文都适合展开。可以限制建议范围，并检查光标是否位于标记或样式语境。