Emmet 在 Sublime Text 中需手动安装并严格配置语法模式、作用域映射和快捷键;默认不启用、不绑定 Tab,必须设为 HTML 语法、光标在行尾、使用 Ctrl+E/Cmd+E 或自定义 Tab 绑定才能生效。

Emmet 在 Sublime Text 中不是“装完就用”的插件,它默认不启用、不绑定 Tab、且严格依赖语法模式。你按 html:5 + Tab 没反应,大概率不是插件坏了,而是 Sublime 根本没把它当 HTML 处理。
确认 Package Control 已就位,否则 Emmet 无法安装
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会失败) - 安装后必须重启 Sublime,再试
Ctrl+Shift+P→ 输入Install Package,能看见选项才算成功 - 企业网络常拦截
packagecontrol.io,此时需手动下载Package Control.sublime-package,放入Installed Packages/目录,再重启
安装 Emmet 插件:只认 sergeche 版本,大小写敏感
Sublime Text 4(及较新 v3)不再内置 Emmet,必须手动装。别搜 emmet 或 Emmet Snippets——这些是旧版或非官方分支,快捷键失效、设置项缺失、不支持 .vue 映射。
- 按
Ctrl+Shift+P→ 输入Package Control: Install Package→ 回车等待列表加载完成 - 输入
Emmet(首字母大写,全拼,不能少字母),选作者显示sergeche的那一项 - 安装后必须重启 Sublime Text,否则
html:5等缩写完全无响应(这是 2026 年多数用户卡住的第一步)
让 Emmet 生效的关键三件事:语法 + 位置 + 触发键
即使插件装对、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/JS 文件里写 HTML 缩写?必须配语言映射
Emmet 不识别 .vue 文件里的 <template> 区域,也不管 .jsx 中的 JSX 标签——它只认语法作用域(scope),不是文件后缀。
立即学习“前端免费学习笔记(深入)”;
- 打开
Preferences → Package Settings → Emmet → Settings - 在用户设置中加入:
"emmet_include_languages": { "vue-html": "html", "javascriptreact": "html" }, "syntax_scopes": { "vue": "text.html.vue", "jsx": "text.html.jsx" } - 保存后,确保文件右下角显示的是
Vue或React JSX,而不是JavaScript;否则映射无效 - 验证方式:
<template>内写div.item$*2+Ctrl+E,应生成两个带编号的<div class="item1"></div>
Emmet 的核心复杂点从来不在安装步骤,而在于它对上下文极其苛刻:它不猜你想写什么,只响应明确匹配的语法作用域和光标位置。漏掉一次 Set Syntax: HTML,或误以为 Tab 是默认键,就等于没装。


















