React must be in scope ⚛️ React

ReferenceError: React is not defined / 'React' must be in scope when using JSX

JSX was compiled with the classic runtime, which needs React imported in every file.

Seen on: React

Meaning

Since React 17 the automatic JSX runtime removes this need, but older Babel/TypeScript/ESLint configs still use the classic runtime (React.createElement).

Common causes

  • tsconfig "jsx": "react" instead of "react-jsx"
  • Babel preset without runtime: 'automatic'
  • ESLint rule react/react-in-jsx-scope still enabled
  • Old CRA/webpack setup

⚡ Quick fix

  1. Use the automatic runtime ("jsx": "react-jsx" / runtime: "automatic")
  2. Or import React from 'react'
  3. Disable react/react-in-jsx-scope with the new runtime

Detailed fix by platform

React

  1. jsx
    // tsconfig.json
    "compilerOptions": { "jsx": "react-jsx" }

How to diagnose

  1. Config — Which JSX runtime is configured?
  2. Linter — Is the ESLint rule the only complaint?

🧠 Still stuck? Analyze your error

Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.