Skip to content

Latest commit

 

History

History
47 lines (30 loc) · 1.25 KB

react-in-jsx-scope.md

File metadata and controls

47 lines (30 loc) · 1.25 KB

Prevent missing React when using JSX (react/react-in-jsx-scope)

When using JSX, <a /> expands to React.createElement("a"). Therefore the React variable must be in scope.

If you are using the @jsx pragma this rule will check the designated variable and not the React one.

Rule Details

Examples of incorrect code for this rule:

var Hello = <div>Hello {this.props.name}</div>;
/** @jsx Foo.bar */
var React = require('react');

var Hello = <div>Hello {this.props.name}</div>;

Examples of correct code for this rule:

import React from 'react';

var Hello = <div>Hello {this.props.name}</div>;
var React = require('react');

var Hello = <div>Hello {this.props.name}</div>;
/** @jsx Foo.bar */
var Foo = require('foo');

var Hello = <div>Hello {this.props.name}</div>;

When Not To Use It

If you are not using JSX, or if you are setting React as a global variable.

If you are using the new JSX transform from React 17, you should disable this rule by extending react/jsx-runtime in your eslint config.