noUselessFragments

JSX and TSX

摘要

¥Summary

规则生效日期：v1.0.0

¥Rule available since: v1.0.0
诊断类别：lint/complexity/noUselessFragments

¥Diagnostic Category: lint/complexity/noUselessFragments
此规则为推荐规则，默认启用。

¥This rule is recommended, which means is enabled by default.
此规则包含 unsafe 修复程序。

¥This rule has an unsafe fix.
此规则的默认严重级别为 information。

¥The default severity of this rule is information.
来源：

¥Sources:
- 与 react/jsx-no-useless-fragment 相同
  
  ¥Same as react/jsx-no-useless-fragment
- 与 react-x/no-useless-fragment 相同
  
  ¥Same as react-x/no-useless-fragment
- 与 @eslint-react/no-useless-fragment 相同
  
  ¥Same as @eslint-react/no-useless-fragment

如何配置

¥How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "complexity": {
5
        "noUselessFragments": "error"
6
      }
7
    }
8
  }
9
}

描述

¥Description

禁止不必要的片段

¥Disallow unnecessary fragments

示例

¥Examples

无效

¥Invalid

1
<>
2
    <>foo</>
3
    <SomeComponent />
4
</>

code-block.jsx:2:5 lint/complexity/noUselessFragments  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ℹ This fragment is unnecessary.
  
    1 │ <>
  > 2 │     <>foo</>
      │     ^^^^^^^^
    3 │     <SomeComponent />
    4 │ </>
  
  ℹ A fragment is redundant if it contains only one child, or if it is the child of a html element, and is not a keyed fragment.
  
  ℹ Unsafe fix: Remove the Fragment
  
    2 │ ····<>foo</>
      │     --   ---

1
<></>

code-block.jsx:1:1 lint/complexity/noUselessFragments ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ℹ This fragment is unnecessary.
  
  > 1 │ <></>
      │ ^^^^^
    2 │ 
  
  ℹ A fragment is redundant if it contains only one child, or if it is the child of a html element, and is not a keyed fragment.

有效

¥Valid

1
<>
2
foo
3
</>

1
<React.Fragment>
2
foo
3
</React.Fragment>

1
<>
2
    <Foo />
3
    <Bar />
4
</>

1
<>foo {bar}</>

noUselessFragments

摘要

如何配置

描述

示例

无效

有效

相关链接