Prettier 默认不格式化 Vue/WXML 等文件因语言 ID 不匹配，需配置 documentSelectors；ESLint 检查内联 JS 需 eslint-plugin-html；eslint-config-prettier 与 eslint-plugin-prettier 必须共用且顺序正确；VS Code 中 prettier.enable 和 language mapping 缺一不可。
HTML项目里直接用 prettier 格式化 HTML 文件，看似简单，但实际常卡在“保存没反应”“内联 JS 不检查”“Vue/WXML 里格式化失效”这些点上——根本原因不是工具不行，而是默认配置不覆盖真实场景。
为什么 prettier 默认只格式化 .html 文件？
Prettier 的 parser 默认只绑定 html 语言 ID，而 VS Code 对 .vue、.wxml、.astro 等文件会识别为对应语言（如 vue），不是 html。结果就是：你按 Ctrl+S，Prettier 根本收不到格式化请求。
- 检查右下角状态栏语言模式，如果是
Vue或WXML，说明 Prettier 没拿到正确 language ID - 必须显式配置
prettier.documentSelectors，例如：["*.vue", "*.wxml", "*.html"] - 对
.vue文件，还需启用prettier.vueIndentScriptAndStyle: true，否则<script>和<style>块缩进不生效 - 旧版 Prettier（如 3.x）对小程序语法支持不稳定，建议降级到
2.8.8并禁用htmlWhitespaceSensitivity类选项
eslint-plugin-html 是 HTML 内联脚本检查的唯一入口
ESLint 默认跳过 HTML 文件里的 <script> 块——它只当整个 HTML 是字符串，不解析 AST。所以你在 <script> 里写了 console.log 或未使用变量，no-console 和 no-unused-vars 规则完全不触发。
- 必须安装并启用
eslint-plugin-html，它会把 HTML 拆解，把<script>提取为 JS 文本交给 ESLint 处理 - 在
.eslintrc.cjs的plugins数组中加入"html" - 确保
overrides配置匹配 HTML 文件路径，例如：{ files: ["**/*.html"], processor: "html/html" } - 若项目含
.vue，优先用@vue/eslint-config-prettier替代通用插件，它已内置 HTML 脚本提取逻辑
eslint-config-prettier 和 eslint-plugin-prettier 必须成对出现
只装 eslint-plugin-prettier，ESLint 会一边执行自己的 indent、quotes 规则，一边让 Prettier “再格式一遍”，最终报一堆冲突警告，比如 Expected indentation of 2 characters 和 Strings must use singlequote 同时亮红。
立即学习“前端免费学习笔记（深入）”；
-
eslint-plugin-prettier把 Prettier 规则转成 ESLint 可执行规则（如prettier/prettier） -
eslint-config-prettier的唯一作用是关掉 ESLint 原生所有格式类规则（indent、semi、quotes等） -
extends数组中，"plugin:prettier/recommended"必须放在最后，否则会被前面的配置（如airbnb）覆盖 - 验证是否生效：运行
npx eslint --print-config index.html | grep -A5 prettier，看到"prettier/prettier": "error"且无quotes类规则残留才算成功
VS Code 中 prettier.enable 和语言标识缺一不可
即使配置全了，VS Code 插件没开或语言 ID 绑错，照样不工作。这不是项目配置问题，是编辑器层漏掉了关键开关。
- 必须在用户或工作区设置中开启
prettier.enable: true（默认是false） - 确认
files.associations正确映射扩展名，例如："*.wxml": "wxml"，否则插件连语言都识别不了 - 若用
.prettierrc.cjs，确保导出的是对象，不是函数；Prettier 2.8+ 不支持动态配置函数 - 禁用其他格式化插件（如 Beautify），避免和 Prettier 抢
formatOnSave控制权
真正麻烦的从来不是配多少行代码，而是 HTML 里混着 JS、CSS、模板语法时，每个环节都要单独打通语言识别、AST 解析、规则注入三层链路。少一个 documentSelectors，少一个 processor，就卡死在“看起来配好了，其实没生效”的状态里。
