emmet插件没反应，首要确认是否通过package control安装官方sergeche版本并重启；需将文件语法设为html（右下角显示html而非plain text），推荐用ctrl+e触发缩写，避免tab键冲突，并按需配置syntax_scopes支持.vue/.jsx等文件。
Emmet 插件没反应？先确认是否真装对了
Sublime Text 默认不带 Emmet，装错渠道或版本是常见原因。官方推荐方式是通过 Package Control 安装 Emmet（注意不是 Emmet Live 或旧版 Emmet Sublime），安装后重启 Sublime 并新建一个 .html 文件——此时输入 div>ul>li*3 再按 Tab，应立刻展开为完整 HTML 结构。
容易踩的坑：
- 文件未设置语法为
HTML（右下角显示Plain Text时 Emmet 不生效，需点开切换） - 用中文输入法或 Caps Lock 开启状态下按
Tab，会插入空格而非触发缩写 - Sublime Text 4 用户若装了老版本 Emmet，可能因 API 变更失效，必须卸载重装最新版
Tab 键失效？改用 Ctrl+E 或检查快捷键冲突
部分系统或插件（如 SideBarEnhancements）会劫持 Tab 键行为，导致 Emmet 缩写无响应。此时可手动触发：Ctrl+E（Windows/Linux）或 Cmd+E（macOS）是 Emmet 的默认展开快捷键，稳定可靠。
也可自定义快捷键避免冲突：
- 打开
Preferences → Key Bindings - 在用户键绑定中添加：
[{"keys": ["enter"], "command": "emmet_expand_abbreviation", "context": [{"key": "selector", "operator": "equal", "operand": "source.html, source.js, source.css"}]}] - 这样在 HTML/JS/CSS 文件中按
Enter就能展开，避开Tab争抢
缩写生成的 class 名带引号？关掉 output_quoted_attributes
默认情况下 Emmet 生成的 class="header" 带双引号，但现代前端项目（尤其 Vue/React）常要无引号写法：class=header。这不是 bug，是配置项控制的。
修改方法：
- 打开
Preferences → Package Settings → Emmet → Settings - 在用户设置中加入：
"output_quoted_attributes": false
- 保存后新写的缩写立即生效，已有代码需重新展开才更新
注意：output_quoted_attributes 影响所有属性，包括 id、src 等，若项目规范要求某些属性必须带引号（如含空格的 class="btn primary"），就别全局关掉，而应配合 filter 用 |c（转为小写 class）或 |e（转义）等修饰符按需处理。
Vue / JSX 文件里缩写不工作？补上语法支持和语法映射
Emmet 默认只认 .html、.css、.js 后缀，.vue 单文件或 .jsx 中的 template/script/style 区块需要显式声明上下文。
操作步骤：
- 打开
Preferences → Package Settings → Emmet → Settings - 在用户设置中加：
"syntax_scopes": { "html": ["text.html.vue", "source.jsx", "source.js.jsx"], "css": ["source.css.vue", "source.css.postcss"] } - 确保 Vue 文件中 template 标签内光标处于
<template></template>和之间，且当前视图语法已设为Vue Component（可通过右下角切换）
如果用了 Volar 插件或 TypeScript + JSX，还需确认 Sublime 没把文件识别成 TypeScriptReact 而非 JavaScript React——后者才是 Emmet 支持的语法名。
复杂点在于：不同框架模板语法差异大，比如 Svelte 的 {#if} 块、Vue 的 v-for 指令，Emmet 不会自动转译，它只管 HTML 结构缩写。想写 div[v-for="item in list"] 这类，得靠自定义缩写或搭配其他插件，Emmet 本身不处理指令逻辑。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
