visual-studio-code - 导入组时出现更漂亮的尾随逗号错误

Question

我遇到了一个问题，在尝试遵循它的尾随逗号规则时，prettier 似乎会自我破坏。这是我所看到的示例：

我的 prettierrc.js 文件：

module.exports = {
  semi: true,
  trailingComma: "all",
  avoidEscape: true,
  printWidth: 120,
  tabWidth: 3
};

我的问题代码：

import {
   Button,
   ButtonGroup,
   CardContent,
   CircularProgress,
   Divider,
   TextField,
   useMediaQuery
} from "@material-ui/core";

发生的事情是 prettier 建议在useMediaQuery之后添加一个逗号。我添加它，然后在保存文件时，prettier 删除导致错误的尾随逗号。

截图：

[ 在我保存之前3

如果单独导入它们，它可以工作。只有当我在一行上导入 6+ 时。

score 0 · Accepted Answer

我遇到了同样的问题，但是经过艰苦的搜索，我修复了在文件中添加trailingComma属性的问题.prettierrc

    {
        ...,
        "trailingComma": "all",
    }

如果您仍然遇到任何问题，只需重新启动 VS Code。

score 0 · Accepted Answer

我有同样的问题，我发现有罪，这是source.organizeImports设置。

如果将设置设置为“false”，问题就会消失。

如果像我一样，你想保持启用这个设置，你可以像这样使用它（数组而不是对象）：

"editor.codeActionsOnSave": [
  "source.organizeImports",
  "source.fixAll.eslint"
],

当你使用一个数组时，顺序是被尊重的，所以organizeImports删除逗号，但fixAll.eslint重新添加它

2 回答 2