emmet在sublime text 4中需手动安装sergeche官方版、重启后设语法为html、缩写置行尾、用ctrl+e(非tab)触发;vue/jsx需额外配置syntax_scopes和emmet_include_languages映射。

Sublime Text 4(及较新 v3)里 Emmet 不是“装完就用”的插件,它默认不启用、不绑定 Tab、且严格按语法模式触发——你敲 html:5 按 Tab 没反应,大概率不是插件坏了,而是 Sublime 根本没把它当 HTML 处理。
确认 Package Control 已安装并可用
Emmet 必须通过 Package Control 安装,没有其他可靠路径。如果 Ctrl+Shift+P(Win/Linux)或 Cmd+Shift+P(macOS)打开命令面板后搜不到 Package Control: Install Package,说明它没装好或已损坏。
- 执行
View → Show Console,粘贴官网最新安装脚本(注意:2026 年起https://packagecontrol.io已强制 HTTPS,旧的http://sublime.wbond.net会失败) - 企业网络常拦截
packagecontrol.io,此时需手动下载Package Control.sublime-package,放入Installed Packages/目录,再重启 Sublime - 安装后必须重启 Sublime,再试
Ctrl+Shift+P→ 输入Install Package,能看见选项才算成功
安装官方 Emmet 插件(sergeche 版)
Sublime Text 4 不再内置 Emmet,必须手动安装。别搜 emmet 或 Emmet Snippets——这些是旧版或非官方分支,快捷键失效、设置项缺失、不支持 .vue 映射。
使用 PptxGenJS 和 Python 解析,将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint(.pptx)演示文稿。
- 按
Ctrl+Shift+P→ 输入Package Control: Install Package→ 回车等待列表加载完成 - 输入
Emmet(首字母大写,全拼,不能少字母),选作者显示sergeche的那一项 - 安装后必须重启 Sublime Text,否则
html:5等缩写完全无响应(这是 2026 年多数用户卡住的第一步)
让 Emmet 在 HTML 文件中真正生效
即使插件装对、Sublime 重启了,div.container+Tab 还是没反应?问题几乎总出在这三点:
- 右下角状态栏必须显示
HTML(不是Plain Text、JavaScript或XML);新建文件默认是Plain Text,务必先按Ctrl+Shift+P→ 输入Set Syntax: HTML - 缩写必须写在行尾,光标紧贴其右侧;前面有空格、换行、中文标点,Emmet 解析器直接放弃
- Sublime Text 4 默认不绑定
Tab到 Emmet,真正生效的是Ctrl+E(Win/Linux)或Cmd+E(macOS);想改回Tab,得在Preferences → Key Bindings用户配置里加:
[ {"keys": ["tab"],"command":"emmet_expand_abbreviation","context": [ {"operand":"source.text.html"} ] } ]
Vue / JSX 文件里写 HTML 缩写?必须配语言映射
Sublime 不原生识别 .vue 或 .jsx 中的 HTML 片段,Emmet 默认跳过这些区域。
- 打开
Preferences → Package Settings → Emmet → Settings - 在用户设置中加入:
"syntax_scopes": {"vue": "text.html.vue", "jsx": "text.html.jsx"} - 再加映射:
"emmet_include_languages": {"vue-html": "html", "javascriptreact": "html"} - 确保文件右下角语法显示为
Vue或React JSX,不是JavaScript
这个步骤漏掉,哪怕缩写全对,在 <template></template> 里也按不出 Tab。Emmet 的核心复杂点从来不在安装步骤里,而在“它到底认不认你当前写的这块内容”。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!










