Emmet在Sublime Text 4中需同时满足语法模式为HTML/CSS、安装sergeche官方版并重启、用Ctrl+E触发三者才生效；装错分支、语法未设置或Tab被劫持是常见失效原因。

Sublime Text 4 默认不启用 Emmet，也不是装完插件就自动好使——它必须满足语法模式、快捷键绑定、配置开关三者同时对齐，缺一不可。

怎么确认 Emmet 真装上了？

别只看 Package Control 列表里有没有“Emmet”——那可能是旧分支或残留项。必须验证三件事：

• 按 Ctrl+Shift+P（Win/Linux）或 Cmd+Shift+P（macOS），输入 Emmet: Expand Abbreviation，能调出命令才算真装上
• 打开 Preferences > Package Settings > Emmet，能看到可编辑的 emmet.sublime-settings 文件
• 新建文件，设为 HTML 语法后输入 ul>li*3，再按 Ctrl+E（非 Tab），能立刻生成结构才算生效

如果命令面板搜不到 Emmet 命令，大概率是装错了分支——只认作者 sergeche 的官方版，名称必须是首字母大写的 Emmet，不能是 emmet-snippets 或 Emmet Live。

右下角显示 Plain Text，Emmet 就一定不工作

Emmet 不看文件后缀名，只认右下角状态栏显示的语法类型。哪怕你刚保存成 index.html，右下角写着 Plain Text，html:5 按 Tab 就绝对没反应。

精英前端设计-专业版

企业级前端设计系统，支持多页面应用、React/Vue组件、品牌一致性与高级动效编排。

下载

• 新建文件后，务必先按 Ctrl+Shift+P → 输入 Set Syntax: HTML 回车
• .vue 文件需先切到 Vue Component 语法；.jsx 要选 JavaScript (JSX)，不是普通 JavaScript
• 临时救急：选中缩写文本（如 div>p*2），按 Ctrl+E 强制展开，绕过语法作用域限制

Tab 键不展开？优先用 Ctrl+E 验证

Sublime Text 4 默认不把 Tab 绑给 Emmet，且 Tab 极易被其他插件劫持（比如 AutoIndent、EditorConfig）。这不是 Emmet 坏了，是快捷键冲突。

• 输入 html:5 后直接按 Ctrl+E（Win/Linux）或 Cmd+E（macOS），若能生成完整 HTML5 结构，说明 Emmet 本身正常
• 想恢复 Tab 触发，得在 Preferences > Key Bindings – User 中加 context 限定，避免误触发
• 检查用户设置中是否误写了 "tab_completion": false——Emmet 依赖该开关，默认为 true

CSS 缩写不生效？得手动配 syntax_scopes

Emmet 默认只在 HTML、XML、JSX 等上下文中启用缩写，CSS 文件默认不支持 m10、pos:a 这类缩写。

• 打开 Preferences > Package Settings > Emmet > Settings – User
• 加入这段配置：

  {
    "syntax_scopes": {
      "css": "source.css",
      "scss": "source.scss",
      "less": "source.less"
    }
  }

• 保存后，在 .css 文件中输入 m10 按 Tab，应展开为 margin: 10px;

复杂点在于：Vue 单文件组件里的 块识别为 source.css.vue，不是纯 source.css，所以仅靠上述配置还不够，得额外补一条 "source.css.vue": "source.css" 才真正覆盖。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！