VS Code中Shift+Alt+F无响应，首要原因是语言模式错误（如显示Plain Text）或未安装/启用对应格式化器（如Prettier、Volar），其次为多格式化器冲突导致fallback失败，需手动指定editor.defaultFormatter并重载窗口。
VS Code 里 Shift+Alt+F 没反应？先看语言模式和格式化器
按下 Shift+Alt+F 却没任何变化，不是快捷键坏了，而是 VS Code 不知道该用谁来格式化。它只负责“发号施令”，不自带 HTML 格式化引擎。
常见卡点：
- 右下角状态栏显示的是
Plain Text或HTML但没装对应扩展——必须手动点开选成HTML - 装了多个格式化器（比如
Prettier、Vetur、js-beautify-html），VS Code 默认 fallback 到“无可用” - Vue 单文件组件中
<template>块被 Vetur 错配成prettier，结果所有属性挤在一行
实操建议：
- 确认已启用
esbenp.prettier-vscode或vscode.html-language-features - Vue 2 项目：搜
vetur.format.defaultFormatter.html，设为js-beautify-html，再Developer: Reload Window - Vue 3 项目：别动 Vetur 配置，直接配
prettier.config.js，加htmlWhitespaceSensitivity: "ignore"
IntelliJ IDEA / WebStorm 怎么格式化 HTML？别用 Ctrl+Alt+L 直接硬套
Ctrl+Alt+L（Mac 是 Cmd+Option+L）在 IDEA 系列里默认只对 Java、JS、TS 等语言生效，HTML 文件需额外确认是否启用对应支持。
立即学习“前端免费学习笔记（深入）”；
关键区别：
- IDEA 内置的 HTML 格式化能力较弱，不识别 Vue/React 指令，也不处理自定义元素（如
<my-card>） - 若打开的是纯
.html文件，且未安装插件，Ctrl+Alt+L可能直接忽略或报错 “No code style settings for HTML” - WebStorm 更激进些，默认启用 HTML 支持，但缩进规则仍依赖
Editor → Code Style → HTML中的配置
实操建议：
- 先右键编辑区 → “Format Document”，看是否有响应；没有就去
Settings → Languages & Frameworks → Schemas and DTDs检查 HTML Schema 是否加载 - 推荐装
Prettier插件，并在Settings → Tools → Actions on Save中勾选 “Reformat code”，指定文件类型为HTML - 若团队用 Prettier，务必关掉 IDEA 自带的 HTML 缩进规则（
Settings → Editor → Code Style → HTML → Other → Enable HTML formatting取消勾选）
Sublime Text 和在线工具怎么补位？当本地编辑器不可靠时
Sublime Text 默认不带 HTML 格式化能力，Ctrl+Shift+I 是空操作——得靠插件驱动。而在线工具虽快，但有隐藏风险。
常见误用场景：
- 粘贴含
<script>或<style>的 HTML 到 freeformatter.com，JS/CSS 被错误换行或删空格，导致运行时报错 - Sublime 安装
HTML-CSS-Class-Completion后，Ctrl+Shift+I才真正生效，但不支持 Vue 指令解析 - 用命令行
prettier --write *.html时，若没配prettier.config.js，默认按 JS 规则处理 HTML，class="a b"可能被折成两行
实操建议：
- Sublime 用户优先装
JsPrettier插件，绑定Ctrl+Shift+H调用本地 Prettier CLI，可控性更高 - 在线工具仅用于临时解压/阅读压缩 HTML，切勿用于生产代码交付
- 批量处理时，在项目根目录建
.prettierrc，明确写"parser": "html"，避免误判
为什么同一份 HTML，在不同 IDE 里格式化结果差异很大？
根本原因不是“谁更准”，而是各工具对 HTML 的解析粒度和规则来源不同：VS Code 依赖 Emmet + language server 的 AST 分析，IDEA 用内置 lexer 做简单标签匹配，Prettier 则走独立 parser（angular-html-parser 或 parse5）。
最易被忽略的细节：
-
html.format.indentInnerHtml在 VS Code 中默认为false，但很多人以为 body 内容天然该缩进一级——其实要手动开 - IDEA 的
Wrap attributes设置在 HTML 下是灰的，实际由 JS 格式化器接管，改了也无效 - 所有工具都对注释敏感：
<!-- <div> -->这种嵌套会直接让 parser 失效，格式化后可能整块消失
真实协作中，与其纠结哪个 IDE 快捷键更快，不如统一用 Prettier CLI + Git hook 强制校验——毕竟人会记错快捷键，但 prettier --check 不会。
