Emmet在Sublime Text 4中默认不工作,必须同时满足三条件:安装sergeche官方版并重启、右下角语法设为HTML/CSS、用Ctrl+E(非Tab)触发;装错分支、语法未设或快捷键被劫持是常见失效原因。

Emmet在Sublime Text 4里根本没反应?先验证三件事
不是插件坏了,而是默认不工作。Sublime Text 4自带的Package Control安装的“Emmet”很可能不是官方版——只有 sergeche/emmet-sublime 这个仓库的才真正可用。装错分支(比如 emmet-snippets 或小写开头的 emmet)会导致命令面板搜不到 Emmet: Expand Abbreviation。
必须手动验证:
- 按
Ctrl+Shift+P(Win/Linux)或Cmd+Shift+P(Mac),输入Emmet: Expand Abbreviation—— 能列出才算装对 - 新建空白文件 →
Ctrl+Shift+P→ 输入Set Syntax: HTML回车,右下角必须显示HTML,不是Plain Text - 输入
ul>li*3后,**不要按 Tab**,改用Ctrl+E(Win/Linux)或Cmd+E(Mac)触发 —— 能生成结构才算真启用
Tab 键不展开缩写?别硬调,直接换快捷键
Sublime Text 4 默认把 Tab 绑定给缩进逻辑,且极易被 AutoIndent、EditorConfig 等插件劫持。强行绑定 Tab 到 Emmet 会带来副作用:在 HTML 文件里 Tab 就再也不能自动缩进了。
最稳做法是统一用 Ctrl+E / Cmd+E:
- 这个快捷键几乎不被其他插件占用,可靠性高
- 支持所有缩写:
!、html:5、div.container>ul>li*3全能触发 - 如果非要
Tab触发,需在Preferences → Key Bindings – User中加 context 限定:[{"keys": ["tab"], "command": "emmet_expand_abbreviation", "context": [{"operand": "source.text.html"}]}]
缩写写了但没生成?检查语法细节和上下文
Emmet 不报错、不提示,写错一个字符就静默失败。高频翻车点集中在空格、引号、连接符上:
-
!必须写在行首,前面不能有空格、换行、中文字符;光标得紧贴!右侧 -
div.container>ul>li*3中不能有中文括号、全角符号,属性值如[href="xxx"]必须用英文双引号 - Vue/JSX 文件中,默认不激活
块外的缩写;需在Emmet.sublime-settings中加:"emmet_include_languages": {"vue-html": "html", "javascriptreact": "html"} - CSS 缩写(如
m10、pos:a)默认不生效,需手动配置syntax_scopes才能在 CSS 文件中启用
为什么 html:5 生成的结构里没有 lang="zh-CN"?
因为 html:5 是 Emmet 内置模板,其输出由 snippets.json 定义,不随系统语言变化。想默认加 lang,得改用户模板:
- 打开
Preferences → Package Settings → Emmet → Settings – User - 添加:
"variables": {"lang": "zh-CN"} - 再配合自定义 snippet:在
Packages/User下建html5.sublime-snippet,内容为:<content><meta charset="${2:utf-8}"> <title>${3:Document}</title> ${4} ]]> <tabtrigger>html5</tabtrigger><scope>text.html</scope> ]]> <p>真正的麻烦不在安装,而在缩写是否被当前 scope 接收、变量是否被正确注入、以及你有没有在错误的语法上下文中测试 —— 这些细节不排查,再多快捷键也白搭。</p></content>
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











