无法在更漂亮的情况下将标签宽度设置为 4答案

【问题标题】：Unable to set tab width to 4 in prettier无法在更漂亮的情况下将标签宽度设置为 4
【发布时间】：2020-02-23 07:13:12
【问题描述】：

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

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

编辑： .prettierrc 文件的内容：

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

【问题讨论】：

您的项目中是否还有.prettierrc 文件，如果有，它包含什么？
@NSjonas 是的。使用文件内容更新问题。
我只使用.prettierrc 文件，我似乎没有任何问题。尝试添加"tabWidth": 4,。您还可以检查“工作区设置”以确保您没有覆盖答案中显示的用户设置。
@NSjonas 我做了“格式化文档”并从更漂亮的 (imgur.com/YYxhWCf) 看到了这个信息对话框，现在我的 .prettierrc 文件缩小到只有两行 {"tabWidth": 4,"useTabs": true} 并且工作正常。看起来更漂亮的 3.0 修复了它或让它变得简单。感谢您的宝贵时间。
在我的项目中使用"tabWidth": 4, in .prettierrc 为我解决了这个问题！谢谢，@nsjonas !!!

标签： visual-studio-code prettier

【解决方案1】：

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

如 cmets 中所述，在 .prettier.js 中添加 tabWidth:2 将解决此问题！

查看documentation 中的tabWidth 选项

【讨论】：

问题出在 indent_style = tab/space 只要你更改为空格，它就会格式化为 4！

【解决方案2】：

禁用“使用标签”选项。希望它会开始正常工作。

【讨论】：

【解决方案3】：

我花了 3 个小时终于弄明白了。

确保底部的空格/制表符设置为 4。
设置中的选项卡大小设置为 4。
更漂亮：选中使用标签。（至少它对我有用）
还可以尝试选中/取消选中编辑器：检测缩进。

Editor: Detect Indentation Prettier use tabs & tab size

【讨论】：

【解决方案4】：

首先，从工作目录中删除所有.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
}

【讨论】：

【解决方案5】：

我自己是如何解决的：

我发现了一个我不知道的扩展（可能安装了包）：编辑器配置。
我发现它弄乱了我的选项卡和其他内容的设置，所以我删除了它。
在 prettier 中取消选中“使用用户设置”。
检查所有选项卡配置，更漂亮的配置。

【讨论】：