Rules

jsx-no-undef

Full Name in eslint-plugin-react-x

react-x/jsx-no-undef

Full Name in @eslint-react/eslint-plugin

@eslint-react/jsx-no-undef

Presets

core
recommended

Description

This rule is used to prevent the use of undefined variables in JSX. It checks for any undefined variables in the JSX code and reports them as errors.

Examples

Failing

const MyComponent = () => {
  return (
    <div>
      <Foo />
    </div>
  );
};

Passing

import Foo from "./Foo";
 
const MyComponent = () => {
  return (
    <div>
      <Foo />
    </div>
  );
};

const Foo = () => <div>Foo</div>;
 
const MyComponent = () => {
  return (
    <div>
      <Foo />
    </div>
  );
};

Implementation

Previous

jsx-no-duplicate-props

Next

jsx-uses-vars