应直接安装html-css-js prettify插件,它不依赖node.js、配置灵活、格式化稳定;通过ctrl+shift+p输入package control: install package后搜索安装,装完需重启sublime text,再手动配置快捷键(如ctrl+alt+f)和css缩进、属性排序等选项。

直接装 HTML-CSS-JS Prettify,别碰名字带 “Beautify” 且两年没更新的插件。它不依赖 Node.js,配置灵活,格式化稳定,是当前最省心的选择。
怎么用 Package Control 安装 HTML-CSS-JS Prettify
按 Ctrl+Shift+P(Win/Linux)或 Cmd+Shift+P(macOS),输入 Package Control: Install Package 回车;等列表加载完,搜 HTML-CSS-JS Prettify 并回车安装。
- 装完必须重启 Sublime Text——部分版本不重启会识别不到命令
- 如果
Preferences → Package Settings里看不到该插件条目,说明没生效,优先重试重启 - 不用单独装 Node.js:这个插件自带格式化逻辑,
JsPrettier才需要,且容易报Node.js not found
为什么按 Ctrl+Shift+H 没反应
因为 HTML-CSS-JS Prettify 默认不绑定任何快捷键。所谓“Ctrl+Shift+H”是旧版插件残留说法,新版完全没这设定。
- 打开
Preferences → Key Bindings,编辑右侧「用户键位文件」 - 加一行:
[{"keys": ["ctrl+alt+f"], "command": "html_css_js_prettify"}] - 保存前务必检查 JSON 语法:漏括号、少逗号会导致整个键位文件失效,Sublime 启动变卡甚至打不开
- macOS 用户请用
cmd+alt+f,不是ctrl
格式化后 CSS 缩进错乱、属性顺序乱怎么办
插件默认用 4 空格缩进 + 字母序排序属性,但项目往往要求 2 空格 + 手写顺序保留(比如 display 必须在 z-index 前面)。
- 打开
Preferences → Package Settings → HTML-CSS-JS Prettify → Set Format Options - 在弹出的用户配置中加入:
"css": {"indent_size": 2, "sort_properties": false} -
sort_properties设为false才真正保留你写的顺序;设true会按 ASCII 排,z-index可能跑到width前面 - 改完保存,再选中 CSS 代码按快捷键,就能按你定的规则来了
最容易被忽略的是:格式化行为完全由配置文件驱动,不是“智能识别项目规范”。哪怕你刚从 Vue 项目切过来,插件也不会自动适配 style 标签里的 scoped 规则——得手动告诉它要关什么、开什么。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











