Sublime Text如何安装Emmet插件？前端开发提速技巧-sublime-PHP中文网

emmet在sublime text 4中需同时满足三个硬条件才生效：1. package control正确安装并可用；2. 安装sergeche官方版emmet（首字母大写）并重启；3. 右下角语法设为html；默认触发键为ctrl+e/cmd+e，tab需手动配置context绑定。

sublime text如何安装emmet插件？前端开发提速技巧

Emmet 在 Sublime Text 4 中不会自动生效，装完插件却按 Tab 没反应，几乎一定是没满足三个硬条件：Package Control 没装对、插件不是 sergeche 官方版、右下角语法没设成 HTML；缺一不可。

Package Control 装没装好，Emmet 根本进不来

手动拖 ZIP、双击安装包、或从非官方渠道下载 Emmet，全是“假安装”：命令面板搜不到 emmet_expand_abbreviation，Preferences → Package Settings 里压根没有 Emmet 选项，快捷键完全无响应。

按 Ctrl+Shift+P（Win/Linux）或 Cmd+Shift+P（macOS），输入 Package Control —— 能弹出菜单才算到位
如果报 urllib.error.URLError 或空白无响应，说明企业网络拦截了 https://packagecontrol.io；直接去官网下载 Package Control.sublime-package，放进 Installed Packages/ 目录，重启 Sublime
控制台执行安装脚本时，必须用官网最新 HTTPS 地址：https://packagecontrol.io/installation；旧的 http://sublime.wbond.net 已在 2026 年起强制失效

只认 `Emmet`（首字母大写，作者 `sergeche`）

Sublime Text 4 不再内置 Emmet，但搜 emmet（小写）、Emmet Snippets 或 Emmet Live 都会装错分支——它们不支持 .vue 映射、缺失设置入口、Ctrl+E 不响应。

PigX UI 前端开发

PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。

下载

按 Ctrl+Shift+P → 输入 Package Control: Install Package → 回车等待列表加载完成
输入 Emmet（注意大小写、不能少字母、不能多空格），只选作者显示 sergeche 的那一项
安装后必须重启 Sublime Text；否则 html:5、ul>li*3 等缩写完全无响应——这是 2026 年用户卡住的第一步

右下角不是 `HTML`，Emmet 直接无视你写的任何缩写

Emmet 不看文件后缀名，只认右下角状态栏显示的语法类型。新建文件默认是 Plain Text，此时敲 div.container + Ctrl+E 也不会有任何反应。

新建文件后，按 Ctrl+Shift+P → 输入 Set Syntax: HTML → 回车，右下角出现 HTML 两个字才算到位
别只输 div 测试——它在非 HTML 模式下可能被 Sublime 自带补全劫持；真正有效的测试是 html:5 或 ul>li*3
如果右下角始终不显示目标语法，检查是否误点了 Revert to Saved，或文件被自动识别为 XML、PHP 等变体（它们默认不启用 Emmet）

`Ctrl+E` 是默认触发键，`Tab` 要自己配

Sublime Text 4 默认不绑定 Tab 到 Emmet；真正生效的是 Ctrl+E（Win/Linux）或 Cmd+E（macOS）。想改回 Tab，得手动加 context 限定，否则会和原生补全冲突。

输入 html:5 后直接按 Ctrl+E（Win/Linux）或 Cmd+E（macOS），若能生成完整 HTML5 结构，说明 Emmet 本身正常
想恢复 Tab 触发，需在 Preferences > Key Bindings – User 中添加：{"keys": ["tab"], "command": "expand_abbreviation", "context": [{"key": "setting.auto_indent"}]}
检查用户设置中是否误写了 "tab_completion": false——Emmet 依赖该开关，默认为 true

Vue / JSX 文件要让 Emmet 生效，还得额外加配置："emmet_include_languages": {"vue-html": "html", "javascriptreact": "html"}；CSS 缩写如 m10、pos:a 默认不支持，得手动配 syntax_scopes。