ts-r
  • Error
  • Reported by the type checker

TS17004

Cannot use JSX unless the '--jsx' flag is provided.

A file contains JSX but the `jsx` compiler option isn't set. Set `jsx` in tsconfig.json.

What it means

JSX in a .tsx file needs to know how it will be compiled, so the jsx option is required. Without it every JSX element is reported with this code. On a real React project this can be the most frequent error when tsconfig.json is missing the option.

Example

index.tsx
export const el = <div />;
ts-r-check -p tsconfig.json --pretty false ts-r output
index.tsx(1,19): error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.
index.tsx(1,19): error TS17004: Cannot use JSX unless the '--jsx' flag is provided.

Recorded by node scripts/verify-examples.mjs with ts-r built from commit 6deaf01. The example uses the default tsconfig: strict, target: es2022, module: esnext, moduleResolution: bundler.

How to fix

  • Set "jsx": "react-jsx" (React 17+), "preserve" (another tool transforms JSX) or the value your framework documents.