VSCode Prettier插件与命令行运行Prettier格式化Svelte文件结果不一致如何排查

排查步骤 #

• 优先确认Prettier及插件版本一致性
  VSCode的Prettier插件默认会使用自带的Prettier版本，和项目本地安装的版本、prettier-plugin-svelte插件版本不一致是这类差异最常见的诱因。
  命令行执行以下命令查看项目本地版本：

  npx prettier --version
  npm list prettier-plugin-svelte
  

  打开VSCode设置，搜索Prettier: Prettier Path，将值设为项目本地的Prettier路径./node_modules/prettier，强制插件使用和命令行一致的版本。
• 确认Svelte文件专属格式化器配置
  如果你安装了Svelte for VSCode等官方插件，可能会覆盖Svelte文件的默认格式化器，在.vscode/settings.json中显式指定Svelte文件使用Prettier格式化：

  "[svelte]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  }
  

• 显式配置文件末尾空行规则
  你当前的.prettierrc没有显式声明insertFinalNewline配置，不同版本的Prettier对该配置的默认值可能不同，同时VSCode自带的files.insertFinalNewline、files.trimFinalNewlines配置也会和Prettier规则冲突。在.prettierrc中显式添加该配置统一规则：

  "insertFinalNewline": true
  

• 验证命令行Prettier是否读取到正确配置
  执行以下命令打印目标文件生效的Prettier配置，确认和你写的.prettierrc一致，排除上层目录配置、全局配置覆盖的可能：

  npx prettier --show-config src/pages/file.svelte
  

• 确认行尾符规则一致
  检查VSCode的files.eol配置是否和.prettierrc中声明的lf一致，避免行尾符差异被误认为是空行差异。

内容的提问来源于stack exchange，提问作者bryan