怎么在VSCode里自动整理代码-Prettier插件配置与使用教程-VSCode-PHP中文网

根本原因是VS Code未正确配置Prettier的执行路径、默认格式化器及规则文件。需在项目中安装prettier依赖，通过.vscode/settings.json指定editor.defaultFormatter、formatOnSave等，并配好.prettierrc；同时禁用ESLint格式规则与冲突插件。

怎么在vscode里自动整理代码-prettier插件配置与使用教程

装了 Prettier 插件却按 Shift+Alt+F 没反应，或者保存后代码没对齐——根本原因不是插件没装好，而是 VS Code 不知道该用什么规则、调哪个工具、处理哪些文件。

为什么装完插件还不能自动格式化

Prettier 插件本身不带默认规则，也不自带可执行的格式化器。它只是个“调度员”，真正干活的是你项目里装的 prettier 包（比如 node_modules/prettier）。如果项目没装、路径不对、或配置缺失，VS Code 就会卡在“没有可用的格式化程序”这一步。

只装插件不装 prettier 依赖：运行 npm install --save-dev prettier 或 yarn add -D prettier
用了 pnpm/yarn v4+ 但插件读不到本地 prettier：在 settings.json 里加 "prettier.prettierPath": "./node_modules/prettier/index.cjs"
没配 .prettierrc 或 prettier.config.js：插件会 fallback 到极简默认值（比如 semi: false），但很多项目需要显式声明规则
配置文件放错位置：VS Code 不会向上查找父目录的 .prettierrc，子项目必须自己放一份

怎么让保存时真正自动对齐

开启 editor.formatOnSave 只是第一步，关键还得告诉 VS Code “谁来干、对谁干、怎么干”。光靠全局设置容易误伤其他项目，推荐用工作区配置。

在项目根目录建 .vscode/settings.json，写死以下三项：
"editor.formatOnSave": true
"editor.defaultFormatter": "esbenp.prettier-vscode"
"editor.formatOnSaveMode": "modifications"（只格式化改过的行，避免大文件重排全篇）
为非 JS/TS 文件手动绑定格式化器，比如 JSON 和 Markdown：
"[json]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }
"[markdown]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }
别在用户设置里全局开 formatOnSave，否则打开别人的项目可能触发意外格式化

Prettier 和 ESLint 冲突时代码越整越乱

典型现象：保存后分号一会儿有、一会儿没；对象属性换行位置反复变。这不是 bug，是两个工具都在试图改同一段代码的格式。

VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载

必须用 eslint-config-prettier 关掉 ESLint 所有格式类规则：运行 npm install --save-dev eslint-config-prettier，并在 .eslintrc.js 的 extends 数组末尾加上 "prettier"
不要同时开 source.fixAll.eslint 和 editor.formatOnSave 做同一件事；推荐只留 "source.fixAll.eslint": true，再把 ESLint 配置成只检查不修复格式（靠 eslint-config-prettier 实现），最终格式化动作全交给 Prettier
禁用 Beautify 等老式格式化插件，它们会抢走 Shift+Alt+F 快捷键

手动格式化失效或弹出“选择格式化程序”提示

按 Shift+Alt+F 后弹出菜单让你选，说明 VS Code 检测到多个可用格式化器，但没设默认项，或者当前文件类型没被绑定。

先确认语言模式正确：右下角状态栏看是否显示 JavaScript、TypeScript 等，不是 Plain Text；点它可切换
检查 settings.json 是否漏了语言专属配置，比如 Vue 项目要加：
"[vue]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }
快捷键被占用？在命令面板搜 Preferences: Open Keyboard Shortcuts，过滤 formatDocument 看绑定是否正常
临时测试：删掉 .vscode/settings.json，只在用户设置里开 formatOnSave 和指定 defaultFormatter，看是否恢复——能恢复就说明工作区配置有冲突