Sublime Text怎么做CSS格式化_Sublime Text CSS代码格式化教程【高效】-sublime-PHP中文网

sublime text 需装插件实现 css 格式化，推荐 jsprettier（依赖 node.js 和 prettier）或 html-css-js prettify（纯 python、开箱即用）；命令不出现多因语法未设为 css 或插件未生效，应检查右下角语法标识、控制台报错及快捷键配置。

sublime text怎么做css格式化_sublime text css代码格式化教程【高效】

Sublime Text 本身不带 CSS 格式化功能，必须装插件；没配好插件或没选对语法类型，Ctrl+Shift+P 调出的命令根本不会出现 Beautify CSS 或类似选项。

推荐直接装 JsPrettier（支持 CSS/SCSS/JS/JSON）或轻量级的 HTML-CSS-JS Prettify。前者依赖 Node.js 和 prettier，后者纯 Python 实现、开箱即用。

JsPrettier：用 Package Control → Install Package → JsPrettier 安装后，需确保系统已全局安装 prettier（npm install -g prettier），否则运行时会报 prettier not found
HTML-CSS-JS Prettify：安装完即可用，但默认快捷键是 Ctrl+Shift+H，不是常见的 Ctrl+Shift+P + 命令调用，容易误以为“没反应”
别装 CSScomb —— 官方已停止维护，Sublime Text 4 下大概率报错 AttributeError: 'NoneType' object has no attribute 'groups'

格式化命令失效，90% 是因为当前文件没被识别为 CSS，或插件根本没绑定到该语法。

Stitch

Stitch是一款AI图像与设计工具，Google Labs 推出的 AI 原生设计工具。

下载

确认右下角状态栏显示的是 CSS，不是 Plain text 或 HTML；如果不是，点击它 → Set Syntax → CSS
如果是 .vue 或 .svelte 文件里的 <style></style> 块，HTML-CSS-JS Prettify 默认不处理，得手动选中 CSS 内容再执行命令
用 Ctrl+Shift+P 输入 Beautify，看是否列出 HTML/CSS/JS Prettify: Reindent Lines；没出现说明插件未生效，重装或检查 Sublime 日志（View → Show Console）里有无 import 错误

默认配置常把单行 CSS 展开成多行，或缩进混乱，实际只需改两个 key：

在插件用户配置里（Preferences → Package Settings → HTML-CSS-JS Prettify → Settings – User），加：
```
{
  "css": {
    "indent_size": 2,
    "end_with_newline": false
  }
}
```
JsPrettier 则优先读取项目根目录的 .prettierrc；若没配，它会用默认的 2 空格 + 单引号，但 CSS 中的 url() 会被强制转义，此时要在 .prettierrc 加 "proseWrap": "preserve" 避免破坏路径
别碰 indent_char 设成 \t —— 多数 CSS 预处理器（如 Sass）和构建工具（Vite/Webpack）默认认空格，混用会导致 sourcemap 错位