javascript - Enforce curly braces for JS switch-cases with ESLint or Prettier - Stack Overflow

admin管理员组

文章数量:1287497

I'd like to enforce curly braces for switch-cases in JS, possibly with ESLint or Prettier. Do you know of any related config, or if not that, then any other linting or formatting tool?

I tried the ESLint rule curly set to "all", but it didn't pain about my curly-less switch-cases.

There is a switch-case ESLint plugin, but I haven't found such a rule in its doc, neither in its source code.

Example

Wrong:

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

Correct:

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

I'd like to enforce curly braces for switch-cases in JS, possibly with ESLint or Prettier. Do you know of any related config, or if not that, then any other linting or formatting tool?

I tried the ESLint rule curly set to "all", but it didn't pain about my curly-less switch-cases.

There is a switch-case ESLint plugin, but I haven't found such a rule in its doc, neither in its source code.

Example

Wrong:

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

Correct:

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

• javascript
• eslint
• code-formatting
• prettier

Share Improve this question Follow edited Aug 21, 2021 at 12:15 lejlun 4,41922 gold badges1818 silver badges3131 bronze badges asked Aug 21, 2021 at 12:00 bzyrbzyr 46744 silver badges1414 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 4

The switch-braces rule in the following eslint custom rules repo seems to be the one you are looking for: https://github./justinanastos/eslint-plugin-justinanastos/blob/master/docs/rules/switch-braces.md

You can give it a try.

You can try 'no-restricted-syntax' rule with such selector.

With verbose output (each non-block child of a case is reported as error):

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

If :has is supported by your parser, you can try this one, but it can have false-positive reports: since child (relative) selectors currently seem to be disallowed in :has, descendant non-block .consequent nodes may throw.

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

*This applies to eslint without plugins.

The curly rule does not apply to blocks in switch cases. Unfortunately there is no good rule that does what you need. You can suggest the rule (or edit to curly rule) here https://github./eslint/eslint/issues.

If you're using unicorn (which I personally can remend), there is a rule for that:

ESLint Plugin Unicorn - Rule: "Switch case braces": https://github./sindresorhus/eslint-plugin-unicorn/blob/main/docs/rules/switch-case-braces.md

It's also in the "remended" preset since v44: https://github./sindresorhus/eslint-plugin-unicorn/releases/tag/v44.0.0

So, it will automatically be applied, if you have in your .eslintrc.json something like:

"plugins": ["@typescript-eslint", ... "unicorn"],
"extends": [ ... "plugin:unicorn/remended"],

本文标签： javascriptEnforce curly braces for JS switchcases with ESLint or PrettierStack Overflow