Rules

avoid-shorthand-fragment

Full Name in eslint-plugin-react-x

react-x/avoid-shorthand-fragment

Full Name in @eslint-react/eslint-plugin

@eslint-react/avoid-shorthand-fragment

Description

Enforces explicit <Fragment> components instead of the shorthand <> or </> syntax.

Examples

Failing

import React from "react";

export function MyComponent() {
  return (
    <>
      <button />
      <button />
    </>
  );
}

Passing

import React, { Fragment } from "react";

export function MyComponent() {
  return (
    <Fragment>
      <button />
      <button />
    </Fragment>
  );
}

Implementation

See Also

avoid-shorthand-boolean
Enforces the use of explicit boolean values for boolean attributes.
prefer-shorthand-boolean
Enforces the use of shorthand syntax for boolean attributes.
prefer-shorthand-fragment
Enforces the use of shorthand syntax for fragments.

avoid-shorthand-boolean

Previous Page

no-dangerously-set-innerhtml

Next Page