如何在Svelte中使用Prettier？VS Code扩展配置疑问求助

• 不管你选择删除Prettier扩展还是保留，核心是要让Svelte的格式化规则与Prettier配置统一，避免冲突：

  1. 保留Prettier扩展并选“是”的情况

     • 确保项目根目录存在正确的.prettierrc或prettier.config.js配置文件，且包含Svelte相关规则：

       // prettier.config.js示例
       module.exports = {
         plugins: ['prettier-plugin-svelte'],
         overrides: [
           {
             files: '*.svelte',
             options: {
               parser: 'svelte',
               printWidth: 80,
               tabWidth: 2,
               singleQuote: true
             }
           }
         ]
       };
       

     • 检查VS Code设置，将.svelte文件的editor.defaultFormatter设为esbenp.prettier-vscode
     • 在项目中执行npm install --save-dev prettier prettier-plugin-svelte，保证本地依赖与扩展版本匹配

  2. 删除Prettier扩展并选“否”的情况

     • 确认VS Code已安装官方Svelte扩展（svelte.svelte-vscode），它自带格式化功能
     • 在VS Code设置里，将.svelte文件的editor.defaultFormatter设为Svelte.svelte-vscode
     • 若使用ESLint，检查.eslintrc配置是否与Svelte内置格式化规则兼容，避免规则冲突

• 通用排查步骤：

  • 通过命令面板执行Developer: Reload Window重启VS Code，确保配置生效
  • 检查项目package.json中是否存在冲突的格式化脚本，比如同时配置了Prettier和Svelte的格式化命令

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