react/react-in-jsx-scope 懸念

何をするか

JSX構文を使用する場合、React がインポートされ、スコープ内にあることを強制します。

このルールは、React 17 以降で新しい JSX 変換を使用している場合は不要であることに注意してください。その場合、このルールを無効化し、React をインポートせずに JSX 構文を含むファイルを使用できます。

tsconfig.json に jsx が react-jsx もしくは react-jsxdev に設定されている場合、新しい JSX 変換を使用しています。Babel を使用する JavaScript プロジェクトでは、.babelrc または babel.config.js 内の React プレセット設定に runtime: "automatic" が含まれている場合、新しい JSX 変換を使用しています。

詳細については、React のブログ記事「新しい JSX 変換の紹介」を参照してください。

なぜ問題なのか

JSX を使用する場合、<a /> は React.createElement("a") に展開されます。したがって、React 変数がスコープ内に存在する必要があります。

例

このルールに対する誤りなコード例：

jsx

const a = <a />;

このルールに対する 正しい コード例：

jsx

import React from "react";
const a = <a />;

使い方

このルールを構成ファイルまたは CLI で 有効化 するには、次のようにします：

Config (.oxlintrc.json)CLI

json

{
  "plugins": ["react"],
  "rules": {
    "react/react-in-jsx-scope": "error"
  }
}

bash

oxlint --deny react/react-in-jsx-scope --react-plugin

参照

ルールのソース

何をするか ​

なぜ問題なのか ​

例 ​

使い方 ​

参照 ​

何をするか

なぜ問題なのか

例

使い方

参照