HTML格式化器默认将<script>视为黑盒，不解析内部JS；需切换语言模式为JavaScript或配置Prettier启用babel解析器，并移除html.format.unformatted中的"script"项。
HTML 编辑器本身不处理 JavaScript 脚本代码的格式化——它只负责 HTML 结构的排版。如果你在 <script> 标签内写了混乱的 JS 逻辑，直接用 HTML 格式化功能（比如 VSCode 的 Shift+Option+F）通常只会缩进标签层级，而不会美化里面的 JS 代码。
为什么 HTML 格式化对 script 内容无效
VSCode、Notepad++ 等编辑器的原生 HTML 格式化器基于 HTML 语法树（AST），它把 <script> 当作一个“黑盒”文本节点处理，除非明确启用 JS 解析能力，否则不会进入内部做语义分析。常见现象包括：
-
<script>console.log("hello");if(a){b();}</script>格式化后仍是一行，无换行、无缩进 - 手动触发格式化时，编辑器右下角语言模式显示为
HTML，而非JavaScript或Embedded Script - 部分编辑器（如旧版 Notepad++）甚至会把
<script>内容当纯文本，连基本换行都不做
正确做法：切换语言模式或使用 JS 专用格式化器
必须让编辑器识别出脚本内容是 JavaScript，才能启用 JS 格式规则。实操路径有两条：
- 在
<script>标签内光标定位后，按下Ctrl+K→Ctrl+M（Windows/Linux）或Cmd+K→Cmd+M（macOS），然后选择JavaScript—— 此时再按Shift+Option+F，就能格式化内部代码 - 更可靠的方式：安装
Prettier插件，并在settings.json中配置"prettier.parser": "babel"，同时确保"editor.defaultFormatter"对javascript和html类型都指向 Prettier - 若使用 VSCode，可右键点击
<script>区域 → “Format Selection”，前提是已选中脚本内容且语言模式为 JavaScript
VSCode 中嵌入式脚本的自动格式化陷阱
即使装了 Prettier，<script> 块默认仍可能被跳过。关键配置项如下：
立即学习“前端免费学习笔记（深入）”；
-
"html.format.unformatted": ["script", "style"]是默认值，意味着 Prettier 会跳过<script>—— 必须显式移除"script"才能生效 - 推荐配置：
"html.format.unformatted": ["style"]，并搭配"prettier.embeddedLanguageFormatting": "auto" - 如果脚本含 ES6+ 语法（如
import、JSX），需额外安装@prettier/plugin-html并启用"prettier.htmlWhitespaceSensitivity": "ignore"，否则格式化可能破坏内联渲染
Notepad++ 用户怎么救急
Notepad++ 没有原生 JS 格式化能力，但可通过外部工具链补足：
- 先安装
js-beautify：npm install -g js-beautify - 在 Notepad++ 中，“运行” → 输入命令：
cmd /c "js-beautify -r -s 2 -f "$(FULL_CURRENT_PATH)""（仅格式化当前文件） - 注意：该命令默认只处理 JS 文件；若要处理 HTML 中的
<script>，需配合正则提取 + 替换，或改用支持 HTML 嵌入格式化的工具如prettier --parser html - 更稳妥的做法是：把
<script>内容复制到临时.js文件中格式化，再粘贴回去
真正容易被忽略的是：HTML 编辑器对嵌入式脚本的格式化支持，始终依赖于“语言识别精度”和“插件解析深度”。哪怕配置全对，只要 <script type="module"> 或 <script type="text/javascript"> 的 type 属性不标准，Prettier 就可能退回到纯文本处理模式。动手前先确认语言模式和 parser 是否匹配，比反复调参数更省时间。
