html格式化失效的根本原因是vs code默认不启用prettier处理html，需显式配置语言专属设置"[html]": {"editor.defaultformatter": "esbenp.prettier-vscode"}，禁用内置格式器（html.format.enable: false），并确保.prettierrc含printwidth、tabwidth、htmlwhitespacesensitivity等必要配置。
HTML格式化不是“按个键就变好看”的魔法，而是有明确规则、工具依赖和常见断点的实操过程。如果你试过 Shift + Alt + F 却发现代码没变化、缩进错乱、或 被自动删掉，问题大概率出在工具链配置或输入内容本身不合规。
VS Code 默认格式化为什么经常“失灵”
VS Code 内置的 HTML 格式化器（vscode-html-languageservice）只做基础排版：它不读 .prettierrc，不支持 tabWidth 或 htmlWhitespaceSensitivity，也不处理未闭合标签或缺失 DOCTYPE 的片段。
- 你看到的“格式化”只是简单换行+缩进，层级深了就糊成一团
- 如果文件没保存为
.html后缀，或开头没写，它可能直接跳过 -
<script></script>里混了 ES6 箭头函数？它会把 JS 部分当普通文本缩进，导致语法错误 - 想让
<div><p>文本</p></div>不拆成三行？默认行为不支持——它认为嵌套就是该换行
Prettier 格式化 HTML 必须满足的三个硬条件
用 prettier 命令行或插件格式化 HTML，不是加个插件就行，得先过三关：
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 文件必须以
.html或.htm结尾（index.txt改名后也要重开编辑器） - 文档开头必须有
—— 缺这个，Prettier 直接当普通文本处理 - 命令行调用时必须显式指定解析器：
prettier --parser html --write src/index.html
漏掉任一条件，prettier 就静默失败，不报错也不改代码。
空格、 和换行在格式化中为何总被“吃掉”
浏览器渲染时，连续空格、Tab、换行符都会被合并为单个空格——这是 HTML 规范行为，不是格式化器的 bug。但格式化工具（尤其 Prettier）会进一步“清理”这些空白，因为它们不参与语义表达。
-
- 想保留段落间的手动换行？得在
.prettierrc里设"htmlWhitespaceSensitivity": "ignore" - 用
<pre class="brush:php;toolbar:false;"></pre>或<code>包裹的文本不会被压缩，但这类标签本身有样式副作用，别滥用 - 邮件模板、内联 HTML 片段等特殊场景，只能靠
<!-- prettier-ignore -->注释跳过整块
真正卡住新手的不是格式化，是格式化前的“脏输入”
90% 的格式化失败，源头不在工具设置，而在你手写的 HTML 本身就不合法：标签没闭合、属性没引号、<img> 写成 <img>（XHTML 风格）、或者混着 这类服务端语法。
这些内容会让任何格式化器无法构建正确 AST，结果要么跳过、要么输出不可预测的缩进。验证方法很简单：把代码粘到 W3C Markup Validator，红标出来的问题，必须先手动修好，再谈格式化。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
