> For AI agents: the complete documentation index is available at https://rslint.rs/llms.txt, the full documentation bundle is available at https://rslint.rs/llms-full.txt.

# jsx-fragments

[Added in v0.6.5](https://github.com/web-infra-dev/rslint/releases/tag/v0.6.5)
## Configuration


```ts title=rslint.config.ts
import { defineConfig, reactPlugin } from '@rslint/core';

export default defineConfig([
  reactPlugin.configs.recommended,
  {
    rules: {
      'react/jsx-fragments': 'error',
    },
  },
]);
```

Enforce shorthand or standard form for React fragments.

## Rule Details

In JSX, a React fragment can be written as either
`<React.Fragment>...</React.Fragment>` or as shorthand `<>...</>`.

Examples of **incorrect** code for this rule in the default `syntax` mode:

```jsx
<React.Fragment>
  <Foo />
</React.Fragment>;
```

Examples of **correct** code for this rule in the default `syntax` mode:

```jsx
<>
  <Foo />
</>;
```

```jsx
<React.Fragment key="key">
  <Foo />
</React.Fragment>;
```

## Rule Options

The first option is `"syntax"` (default) or `"element"`.

Examples of **incorrect** code for this rule with `"element"`:

```json
{ "react/jsx-fragments": ["error", "element"] }
```

```jsx
<>
  <Foo />
</>;
```

Examples of **correct** code for this rule with `"element"`:

```jsx
<React.Fragment>
  <Foo />
</React.Fragment>;
```

Support for fragments was added in React v16.2, so the rule reports either form
when an older React version is specified in shared settings.

A file-level `@jsx` annotation selects the JSX factory for that file and takes
precedence over `settings.react.pragma`. For example, `/** @jsx Preact.h */`
makes the long fragment form `Preact.Fragment`. The fragment member name can
still be configured separately with `settings.react.fragment`.

## Original Documentation

- [eslint-plugin-react: jsx-fragments](https://github.com/jsx-eslint/eslint-plugin-react/blob/v7.37.5/docs/rules/jsx-fragments.md)
- [Source code](https://github.com/jsx-eslint/eslint-plugin-react/blob/v7.37.5/lib/rules/jsx-fragments.js)