使用 ESLint 或 Prettier 為 JS switch-cases 強制使用大括號

Question

我想在 JS 中為 switch-cases 強制使用花括號，可能使用 ESLint 或 Prettier。 你知道任何相關的配置嗎？如果不知道，那么還有其他的 linting 或格式化工具嗎？

我嘗試將 ESLint 規則curly設置為"all" ，但它並沒有抱怨我的 curly-less switch-cases。

有一個switch-case ESLint plugin ，但我沒有在它的文檔中找到這樣的規則，在它的源代碼中也沒有。

例子

錯誤的：

switch (foo) {
  case "bar":
    return 1;
  case "baz":
    return 2;
  default:
    return 0;
}

正確的：

switch (foo) {
  case "bar": {
    return 1;
  }
  case "baz": {
    return 2;
  }
  default: {
    return 0;
  }
}

Answer 1

以下 eslint 自定義規則 repo 中的switch-braces規則似乎是您正在尋找的規則： https://github.com/justinanastos/eslint-plugin-justinanastos/blob/master/docs/rules/switch-braces。醫學博士

你可以試一試。

Answer 2

您可以使用此類選擇器嘗試“無限制語法”規則。

冗長的 output（案例的每個非塊子項都報告為錯誤）：

    'no-restricted-syntax': ['error',
      {
        'selector': 'SwitchCase > *.consequent[type!="BlockStatement"]',
        'message': 'Switch cases without blocks are disallowed.'
      },
    ],

如果:has被你的解析器支持，你可以試試這個，但它可能有誤報：因為子（相對）選擇器目前似乎在:has中是不允許的，后代非塊.consequent節點可能會拋出。

    'no-restricted-syntax': ['error',
      {
        'selector': 'SwitchCase:has(*.consequent[type!="BlockStatement"])',
        'message': 'Switch cases without blocks are disallowed.'
      },
    ],

Answer 3

*這適用於沒有插件的 eslint。

curly規則不適用於 switch case 中的塊。 不幸的是，沒有好的規則可以滿足您的需要。 您可以在此處建議規則（或編輯卷曲規則） https://github.com/eslint/eslint/issues 。