[Docs] improve instructions for jsx-runtime config

Closes #3052

Author: ljharb

CHANGELOG.md

@@ -29,7 +29,9 @@ This change log adheres to standards from [Keep a CHANGELOG](http://keepachangel
 * [Docs] [`jsx-uses-react`], [`react-in-jsx-scope`]: document [`react/jsx-runtime`] config ([#3018][] @pkuczynski @ljharb)
 * [Docs] [`require-default-props`]: fix small typo ([#2994][] @evsasse)
 * [Tests] add weekly scheduled smoke tests ([#2963][] @AriPerkkio)
+* [Docs] improve instructions for `jsx-runtime` config ([#3052][] @ljharb)
 
+[#3052]: https://github.com/yannickcr/eslint-plugin-react/issues/3052
 [#3049]: https://github.com/yannickcr/eslint-plugin-react/pull/3049
 [#3048]: https://github.com/yannickcr/eslint-plugin-react/pull/3048
 [#3043]: https://github.com/yannickcr/eslint-plugin-react/issues/3043

README.md

@@ -31,7 +31,7 @@ Use [our preset](#recommended) to get reasonable defaults:
   ]
 ```
 
-If you are using the [new JSX transform from React 17](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#removing-unused-react-imports), extend [`react/jsx-runtime`](https://github.com/yannickcr/eslint-plugin-react/blob/HEAD/index.js#L163-L176) in your eslint config to disable the relevant rules.
+If you are using the [new JSX transform from React 17](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#removing-unused-react-imports), extend [`react/jsx-runtime`](https://github.com/yannickcr/eslint-plugin-react/blob/HEAD/index.js#L163-L176) in your eslint config (add `"plugin:react/jsx-runtime"` to `"extends"`) to disable the relevant rules.
 
 You should also specify settings that will be shared across all the plugin rules. ([More about eslint shared settings](https://eslint.org/docs/user-guide/configuring/configuration-files#adding-shared-settings))
 

docs/rules/jsx-uses-react.md

@@ -45,4 +45,4 @@ var Hello = <div>Hello {this.props.name}</div>;
 
 If you are not using JSX, if React is declared as global variable, or if you do not use the `no-unused-vars` rule.
 
-If you are using the [new JSX transform from React 17](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#removing-unused-react-imports), you should disable this rule by extending [`react/jsx-runtime`](https://github.com/yannickcr/eslint-plugin-react/blob/HEAD/index.js#L163-L176) in your eslint config.
+If you are using the [new JSX transform from React 17](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#removing-unused-react-imports), you should disable this rule by extending [`react/jsx-runtime`](https://github.com/yannickcr/eslint-plugin-react/blob/HEAD/index.js#L163-L176) in your eslint config (add `"plugin:react/jsx-runtime"` to `"extends"`).

docs/rules/react-in-jsx-scope.md

@@ -44,4 +44,4 @@ var Hello = <div>Hello {this.props.name}</div>;
 
 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](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#removing-unused-react-imports), you should disable this rule by extending [`react/jsx-runtime`](https://github.com/yannickcr/eslint-plugin-react/blob/HEAD/index.js#L163-L176) in your eslint config.
+If you are using the [new JSX transform from React 17](https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#removing-unused-react-imports), you should disable this rule by extending [`react/jsx-runtime`](https://github.com/yannickcr/eslint-plugin-react/blob/HEAD/index.js#L163-L176) in your eslint config (add `"plugin:react/jsx-runtime"` to `"extends"`).