Vue文件格式化失败主因是插件冲突与配置缺失：必须禁用Vetur、启用Volar及TypeScript-Vue插件，并在settings.json中正确配置editor.defaultFormatter、[vue]语言专属设置及禁用VSCode原生JS/TS格式器。
Vue 文件在 VSCode 中格式化失败，基本不是代码本身的问题，而是编辑器没认出这是 Vue 文件，或者没配对格式化器。核心就两点：插件装对、settings.json 里指定清楚谁来管 .vue 的哪一块。
确认你用的是 Volar 而不是 Vetur（Vue3 必须）
Vetur 已停止维护，Vue3 项目硬用它会卡住 <style> 和 <script setup> 的格式化。Volar 是 Vue 官方推荐的现代替代方案，且必须启用 “TypeScript-Vue Plugin” 才能解析 SFC 内部结构。
- 打开扩展面板（
Ctrl+Shift+X），搜Vue Language Features (Volar)，安装并**禁用 Vetur**（两者冲突） - 按
Ctrl+Shift+P输入Developer: Toggle Developer Tools，看 Console 有没有Vetur is active报错——有就说明没关干净 - Volar 默认不接管格式化，得靠
settings.json显式委托给 Prettier
settings.json 必须写对这三块（少一个都不行）
很多人只配了 "[vue]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }，但漏掉全局默认和语言冲突项，导致保存时没反应。
-
"editor.defaultFormatter": "esbenp.prettier-vscode"—— 兜底，防止其他语言 fallback 到 VSCode 自带格式器 -
"[vue]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }—— 明确告诉 VSCode：.vue文件整体交由 Prettier 处理 -
"javascript.format.enable": false和"typescript.format.enable": false—— 关闭 VSCode 原生 JS/TS 格式器，否则它会在<script>里抢格式化权，和 Prettier 冲突
style 块不格式化？检查 Prettier 是否支持你的 CSS 预处理器
<style lang="scss"> 或 <style lang="less"> 不生效，大概率是 Prettier 没装对应插件，或配置没透传到 Volar。
立即学习“前端免费学习笔记（深入）”；
- 确保已安装
Prettier - Code formatter插件（ID：esbenp.prettier-vscode） - 在项目根目录加
.prettierrc，至少包含：{"semi": false, "singleQuote": true, "tabWidth": 2} - 如果用了 SCSS/LESS，Prettier 默认支持；但若用了
postcss或自定义语法，需额外装prettier-plugin-postcss并在.prettierrc里加"plugins": ["prettier-plugin-postcss"] - 别信 Vetur 那套
vetur.format.defaultFormatter.css配置——Vue3 下 Volar 不读这个
保存后没自动格式化？先验证触发条件是否满足
格式化不是“装完插件就自动跑”，它依赖三个开关同时打开，且文件类型被正确识别。
- 检查右下角状态栏语言模式是不是
Vue（不是HTML或Plain Text）；点它手动切一次 -
"editor.formatOnSave": true必须存在，且不能被工作区设置覆盖（比如.vscode/settings.json里写了false） - 如果用了 ESLint，
"editor.codeActionsOnSave": {"source.fixAll.eslint": true}会和 Prettier 竞争，建议只留一个：Prettier 负责样式/结构，ESLint 负责逻辑规范 - 快捷键
Shift+Alt+F（Win）或Shift+Option+F（Mac）可手动触发，失败时看右下角弹窗提示——常见报错是No formatter found，说明[vue]那段配置没生效
最常被忽略的其实是语言模式识别和插件共存问题：Volar 和 Vetur 同时启用、.vue 文件被当成 HTML 解析、Prettier 配置放在用户级 settings 而被工作区覆盖。这些问题不解决，调再多参数都没用。
