Package Control 是硬性前提，需通过命令面板验证；SideBarEnhancements 增强侧边栏功能；Emmet 提升 HTML/CSS 编码效率；GitGutter 标记 Git 更改行；ColorHighlighter 实时渲染颜色值。
Package Control 必须先装好，否则后面所有插件都装不了——这是硬门槛，不是可选项。
怎么确认 Package Control 装成功了
按下 Ctrl+Shift+P（macOS 是 Cmd+Shift+P），弹出命令面板后输入 Install Package，如果能看到带 “Package Control” 字样的选项，说明已就位；如果提示 “command not found”，就得重装。常见错误是安装中途被网络中断，= 晃动消失但没弹成功提示框，这种得手动删掉 Packages/Package Control 目录再试。
SideBarEnhancements：侧边栏不只用来点文件
原生侧边栏连右键菜单都简陋得像功能开关刚打开的年代。装了它之后：
• 右键新增 Open in Terminal、Copy Path、Reveal in Explorer 等实用项
• 支持拖拽文件夹到侧边栏自动创建新项目
• Move to Trash 比系统回收站更直接（Windows 下对应删除）
• 不依赖 Git 或其他插件，独立运行，启动快、无兼容性问题
注意：它不会自动刷新侧边栏内容，改名或删文件后需手动右键 → Refresh Folder，这点容易被忽略。
Emmet：写 HTML/CSS 别再手敲 div 套 div
它不是“锦上添花”，而是前端日常编码的呼吸机：
• 输入 ul>li*5 + Tab → 自动展开成带编号的列表
• 在 CSS 中输 m10 + Tab → 展开为 margin: 10px;
• 支持 Vue/JSX 的 div.my-class#my-id 语法，但需在设置里把 html 语法切换成 Vue Component 或 React JSX 才生效
• 默认只对 .html、.css、.scss 文件启用，想在 .vue 或 .jsx 里用，得进 Preferences → Package Settings → Emmet → Settings，加一行 "syntax_scopes": ["source.vue", "source.js.jsx"]
GitGutter：不用切窗口就知道哪行改过
它不执行 Git 命令，只做一件事：在编辑器行号旁画小图标，标出新增、修改、删除的行。
• 图标颜色和位置直接对应 Git 状态，绿色 ▶ 新增，橙色 ● 修改，灰色 ◆ 删除
• 不依赖本地 Git 仓库根目录位置，只要文件在 Git 工作区里，哪怕嵌套多层子目录也识别
• 和 SublimeLinter 之类插件共存时，图标可能被挤偏，这时要进 Settings – User 加一句 "git_gutter_width": 12 控制宽度
• 它不显示 diff 内容，真要看改动细节，还得靠 Git 插件或终端，别指望它替代 git diff
ColorHighlighter：别再复制十六进制去浏览器查色值
代码里出现 #3a86ff、rgba(255, 99, 132, 0.7) 或 hsl(200, 100%, 50%)，它会实时渲染一个微缩色块在旁边。
• 支持所有 CSS 合法颜色格式，包括 var(--primary)（需配合 CSS 自定义属性插件）
• 颜色块点击可复制色值，长按可调出拾色器修改
• 默认开启，但若发现不生效，检查是否被主题覆盖：有些深色主题会让色块透明度变低，此时进 Preferences → Package Settings → ColorHighlighter → Settings，调高 "highlight_alpha"（比如设成 0.8）
• 它不解析变量或 CSS-in-JS 字符串里的颜色，只认标准 CSS 语法上下文
Emmet 在 .vue 文件里失效，往往不是插件坏了，而是语法模式没切对；GitGutter 不显示图标，大概率是当前文件根本没被 Git 跟踪，而不是插件没装好。装完别急着重启，先按 Ctrl+Shift+P 确认命令可用，再开个真实项目文件试试效果。 
