无法将标签宽度设置为 4 更漂亮

Question

我为 vscode 安装了更漂亮的扩展并将标签宽度配置为 4 个空格，但它仍然用 2 个空格缩进新行。我做错了什么？

这是我格式化文件时显示的 gif：

编辑：.prettierrc文件的内容：

{
  "trailingComma": "none",
  "overrides": [
    {
      "files": "**/lwc/**/*.html",
      "options": { "parser": "lwc" }
    },
    {
      "files": "*.{cmp,page,component}",
      "options": { "parser": "html" }
    }
  ]
}

Answer 1

首先，.prettierrc从工作目录中删除任何内容。因为它会覆盖用户设置并使用默认值。

第二，设置Prettier: Tab Width为4。

三、未勾选Prettier: Use Tabs

如果您必须使用.prettierrc文件，请指定所有选项。

{
    "singleQuote": true,
    "printWidth": 80,
    "editor.formatOnSave": true,
    "proseWrap": "always",
    "tabWidth": 4,
    "requireConfig": false,
    "useTabs": false,
    "trailingComma": "none",
    "bracketSpacing": true,
    "jsxBracketSameLine": false,
    "semi": true
}

Answer 2

这些可能性都没有解决我使用Prettier的VS Code案例。

但 Prettier 网站向我展示了如何做到这一点！

本节（https://prettier.io/docs/en/options.html#tab-width）将我带到.editorconfig网站（https://editorconfig.org/）：

我.editorconfig在项目的根文件夹中找到了这个文件，它有两个我更改的特定配置。

前

indent_style = space
indent_size = 2

后

 indent_style = tab
 indent_size = 4

终于成功了！

Answer 3

禁用“使用选项卡”选项。希望它能开始正常工作。

Answer 4

我认为这是因为在用户设置中指定了 tabWidth:4 。而在工作区设置中没有指定任何内容，因此它使用工作区的默认值，即 tabWidth:2 ，

如注释中所述，也添加tabWidth:2.prettier.js 将修复它！

https://prettier.io/docs/en/options.html#tab-width