推荐使用jsprettier插件：它基于prettier，支持html/css/js三合一格式化，需全局安装prettier并配置项目根目录下的.prettierrc文件，关键选项包括"htmlwhitespacesensitivity": "css"和"htmlselfclosingtag": false（如需禁用自闭合）。
HTML格式化插件选哪个：JsPrettier vs. HTML-CSS-Class-Completion
Sublime Text 自身不带 HTML 格式化能力，必须靠插件。别装 HTML-CSS-Class-Completion——它只补全类名，不格式化。真正能用的只有 JsPrettier（配合 Prettier）或 Sublime-HTML-Beautify，但后者已多年未更新，对现代 HTML5 语义标签（如 <dialog></dialog>、<slot></slot>）支持差，容易错位闭合。
推荐直接上 JsPrettier：它底层调用 Node.js 的 prettier，支持 HTML/CSS/JS 三合一格式化，配置一次，全局生效。
- 确保系统已安装 Node.js（运行
node -v和npm -v验证） - 终端执行
npm install -g prettier（全局安装，避免每次项目重装） - Sublime 中通过 Package Control 安装
JsPrettier，重启后按Ctrl+Shift+H（Windows/Linux）或Cmd+Shift+H（macOS）触发格式化
prettier 配置文件怎么写：.prettierrc 放哪、写什么
prettier 不读 Sublime 的设置，只认项目根目录下的 .prettierrc 或 prettier.config.js。放错位置就等于没配——比如放在 ~/Library/Application Support/Sublime Text/Packages/User/ 下完全无效。
最简可用配置（保存为项目根目录的 .prettierrc）：
{
"tabWidth": 2,
"useTabs": false,
"htmlWhitespaceSensitivity": "css",
"endOfLine": "lf"
}
-
htmlWhitespaceSensitivity: "css"是关键：避免把<div> text </div>格式化成<div>text</div>（会丢空格），适合含内联文本的模板 - 别设
semi: false——HTML 文件里没分号，这个选项只影响 JS，设了反而让 Prettier 在混排文件中误判 - 如果项目用 Vue 或 Svelte，需额外加
"parser": "html"，否则单文件组件里的<template></template>块可能被当成 JS 解析
格式化失效常见原因：快捷键冲突、语法识别错、HTML 版本不匹配
按下快捷键没反应？先看右下角状态栏显示的语法类型是不是 HTML。如果是 Plain text 或 XML，JsPrettier 直接跳过——它只处理明确标记为 HTML 或 Vue 的视图文件。
- 手动切换语法：右下角点击当前语法名 → 选
HTML；或按Ctrl+Shift+P→ 输入Set Syntax: HTML - 检查是否被其他插件劫持快捷键：打开
Preferences → Key Bindings，搜索js_prettier，确认没有被Emmet或SideBarEnhancements覆盖 - 如果格式化后
<input type="checkbox">变成<input type="checkbox">（自闭合），不是 bug——这是 Prettier 对 HTML5 的合规处理，但某些老旧 CMS 会报解析错误；此时需在.prettierrc加"htmlSelfClosingTag: false"
为什么不用 Sublime 内置 reindent：它根本不理解 HTML 结构
Sublime 自带的 Indentation → Reindent（快捷键 Ctrl+Alt+[）只是按缩进空格数机械对齐，遇到 <table><tr><td>内容</td></tr></table> 这种嵌套，会把所有标签顶到行首，或者全塞成一行——因为它不解析 DOM 树，只数括号和换行。
真要临时救急，可用 Ctrl+Shift+P → 输入 HtmlBeautify（前提是装了同名插件），但它不支持 ESLint 集成、不识别 data- 属性优先级、对模板字符串中的 HTML 字符串直接报错。不如花五分钟配好 JsPrettier。
真正麻烦的从来不是“怎么配”，而是配完发现团队里有人用 VS Code、有人用 WebStorm，各自 prettier 版本不一致，导致同一段 HTML 格式化结果不同。这时候统一锁死 prettier 版本 + 提交 .prettierrc 到仓库，比在 Sublime 里调一百次设置管用。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
