More clarification when not to use react/react-in-jsx-scope (Next.js)

[NeatNit]

I think the doc page for react/react-in-jsx-scope should better detail when this rule is not to be used. For example, Next.js imports React when compiling so you don't need to do it yourself, but it doesn't technically "set React as a global variable" like described under "When Not To Use It".

[ljharb]

It's worth a mention, but there's still value in not doing what Next.js does, and explicitly importing React in every file.

[NeatNit]

That would be worth adding then. I'd like to know why, too...

[ljharb]

Because explicit > implicit, and relying on implicitly added globals is magic that makes it harder for new users to understand what's going on.

[foray1010]

@ljharb While I totally agree explicit > implicit, babel v8 will automatically import react, it brings benefit to automatically decide whether to import from react/jsx-runtime or not, as a better replacement of React.createElement().

I think it is a new angle to the issue. Should we reconsider to update documentation and also recommended config?

[ljharb]

That's still an RFC, and very much not a certainty (that post isn't from babel or react, ftr), and either way that's a long way off.

At the moment, you should always have React in scope when you're using jsx and react.

[karlhorky]

I guess the Babel 8 + React 17 change to automatically import React with the new JSX transform is getting closer to reality:

https://babeljs.io/blog/2020/03/16/7.9.0#a-new-jsx-transform-11154-https-githubcom-babel-babel-pull-11154

Aside from Next.js, now Gatsby has support for this:

gatsbyjs/gatsby#26652

In case this keeps going this way, it may make sense at some point in the next year or two to re-evaluate this rule.

[karlhorky]

Looks like it's getting more real (besides Gatsby and Next.js, CRA v4 will support it, and the change will also be backported to React 0.14.x, 15.x, and 16.x):

https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html

@ljharb what are your thoughts on re-opening this issue?

[ljharb]

If you're using react 17, you'd simply disable this rule. As soon as React 17 is fully released, we'll update the docs page.