error TS17004: Cannot use JSX unless the '--jsx' flag is provided.(--locale ja を付けると error TS17004: '--jsx' フラグが指定されていないと、JSX を使用できません。)は、.tsx のファイルに書いた JSX を、jsx の設定が無いまま TypeScript が調べたときの文です。TS17004 は、TypeScript がエラーごとに付けている番号です。同じ行に、JSX の型が見つからないという TS7026 も出ます。
直し方は、tsconfig.json の compilerOptions に "jsx": "react-jsx" を書くことです。Vite の react-ts のひな形(tsconfig.app.json に入っています)と Next.js のひな形が入れている値です。
書いたのに出るときは、tsc にファイル名を渡していないかを見ます。TypeScript 6.0 から、tsconfig.json のあるフォルダーで npx tsc Hello.tsx とすると TS5112 で止まります。TS5112 の文は --ignoreConfig を付けるよう勧めていますが、付けると tsconfig.json の jsx が読まれないので、TS17004 が出ます。ファイル名を渡さずに、npx tsc -p .(Vite のひな形なら npx tsc -b)で調べます。
確かめた環境は、TypeScript 7.0.2 と 6.0.3(エラーの文は同じ)・@types/react 19.3.0・react 19.3.1・Node.js 24.22.1 です。Docker の Linux で、2026年10月23日に流しました。Windows と macOS では流していません。
- TS17004 のエラーの全文(英語と
--locale jaの日本語)と意味 - tsconfig.json に書く
jsxの値(ひな形が入れている値) tscにファイル名を渡したときの TS5112 と、--ignoreConfigを付けたときの結果- 一緒に出るエラー(TS7026・TS1161)の行き先
TS17004 はどんなエラー?
TS17004 は、jsx の設定が無いときの文です。設定の意味は、下の「jsx の設定とは」で説明します。
エラーの全文(英語と --locale ja)
.tsx に <h1>Hello</h1> を書き、tsconfig.json に jsx が無いフォルダー(d-nojsx)で調べた出力です。TS17004 と同じ行に TS7026 が出ています。
$ npx tsc --noEmit -p d-nojsx
d-nojsx/src/Hello.tsx(2,10): error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.
d-nojsx/src/Hello.tsx(2,10): error TS17004: Cannot use JSX unless the '--jsx' flag is provided.
d-nojsx/src/Hello.tsx(2,19): error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.
$ npx tsc --noEmit -p d-nojsx --locale ja
d-nojsx/src/Hello.tsx(2,10): error TS7026: インターフェイス 'JSX.IntrinsicElements' が存在しないため、暗黙的に JSX 要素の型は 'any' になります。
d-nojsx/src/Hello.tsx(2,10): error TS17004: '--jsx' フラグが指定されていないと、JSX を使用できません。
d-nojsx/src/Hello.tsx(2,19): error TS7026: インターフェイス 'JSX.IntrinsicElements' が存在しないため、暗黙的に JSX 要素の型は 'any' になります。
日本語の文は、--locale ja を付けたときの TypeScript の文です。TypeScript 7.0.2 と 6.0.3 で、文は同じでした。TS7026 の意味は、JSX element implicitly has type 'any' の記事で説明しています。
jsx の設定とは
TypeScript の Handbook は、JSX を使うには「ファイルの名前を .tsx にする」ことと「jsx の設定を有効にする」ことの 2 つをする、と書いています。jsx は、コマンドの --jsx か、tsconfig.json の jsx で決めます。コマンドの説明は「どんな JSX のコードを出すか」で、選べる値は preserve・react・react-native・react-jsx・react-jsxdev です。
tsconfig.json の jsx は、.tsx から作られる JavaScript のファイルに、JSX をどう書き出すかを決めます。値ごとの違いは、tsconfig の記事にまとめました。
どう直す? tsconfig.json に jsx を書く
tsconfig.json の compilerOptions に、jsx を 1 行書きます。Vite の react-ts のひな形と、Next.js のひな形が入れている値です。すでに compilerOptions があるときは、その中に 1 行足します。
{ "compilerOptions": { "jsx": "react-jsx" } }
同じ中身の .tsx に "jsx": "react-jsx" を設定したフォルダー(a-tsx)を調べると、何も出ませんでした。
$ npx tsc --noEmit -p a-tsx
この手元の例は、@types/react を入れたフォルダーでの結果です。@types/react が無いと TS7026 などが残ります(→ JSX element implicitly has type 'any' の記事)。
Vite の react-ts のひな形では、jsx は tsconfig.app.json に入っています。
tsc で型を調べるだけでなく、tsx で動かすときも、.tsx では tsconfig.json の jsx を読みます。手元では、"jsx": "react-jsx" の tsconfig.json があると .tsx が動き、無いと ReferenceError: React is not defined になりました。詳しくは npx tsx の記事にあります。
書いたのに出るのはなぜ? tsc にファイル名を渡していないか
jsx を書いたのに TS17004 が出るときは、tsc にファイル名を渡していないかを見ます。TypeScript 6.0 の告知によると、6.0 より前は、tsconfig.json のあるフォルダーで tsc foo.ts のようにファイル名を渡すと、tsconfig.json は黙って無視されていました。6.0 からは、これをエラー(TS5112)にします。この記事では、5 系は流していません。
{ "compilerOptions": { "jsx": "react-jsx", "strict": true, "noEmit": true } } の tsconfig.json があるフォルダーで、Hello.tsx を渡した出力です。
$ npx tsc Hello.tsx
error TS5112: tsconfig.json is present but will not be loaded if files are specified on commandline. Use '--ignoreConfig' to skip this error.
$ npx tsc Hello.tsx --locale ja
error TS5112: tsconfig.json は存在しますが、コマンドラインでファイルが指定されている場合は読み込まれません。このエラーをスキップするには、'--ignoreConfig' を使用します。
TS5112 の文は、--ignoreConfig を付ければこのエラーを飛ばせる、と案内しています。6.0 の告知は、tsconfig.json を無視して TypeScript の既定の設定でファイルを調べたいなら、この設定を使う、と書いています。コマンドの説明では、--ignoreConfig は「見つけた tsconfig を無視し、コマンドのオプションとファイルで組み立てる」設定です。つまり、付けると tsconfig.json の jsx が読まれないので、TS17004 と TS7026 が出ました。
$ npx tsc --ignoreConfig --noEmit Hello.tsx
Hello.tsx(2,10): error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.
Hello.tsx(2,10): error TS17004: Cannot use JSX unless the '--jsx' flag is provided.
Hello.tsx(2,19): error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists.
コマンドで --jsx react-jsx を足せば通ります。tsconfig.json を読ませたいなら、ファイル名を渡さずに -p . で調べるほうが、書いた設定がそのまま効きます。どちらも、エラーなしで通りました。
$ npx tsc --ignoreConfig --noEmit --jsx react-jsx Hello.tsx
$ npx tsc -p .
TS5112 が出る背景(6.0 での変更)は、TypeScript 7 の記事にあります。
Vite のひな形で調べるとき
Vite の react-ts のひな形(create-vite 9.3.1)は、ルートの tsconfig.json が "files": [] と 2 つの references(tsconfig.app.json・tsconfig.node.json)だけです。jsx は tsconfig.app.json にあります。そのため、ルートの tsconfig.json を見ても jsx は見つかりません。
ひな形の package.json では、"build": "tsc -b && vite build" となっていて、先に tsc -b で型を調べてから Vite で組み立てます。型だけを調べたいときは、ファイル名を渡さずに npx tsc -b を流します。
よくある質問
"jsx": "preserve" でも、このエラーは消えますか?
TS17004 は出なくなりました。preserve は、JSX をそのまま出す設定です。ただし、types を書いていないと、TS7026 が出ました(手元の実験の .tsx は React を import していません)。直し方は、JSX element implicitly has type 'any' の記事にあります。
TS7026 も一緒に出ています
TS17004 と同じ行に TS7026 が出るのは、jsx が無いときの出方でした。jsx を書いたあとも TS7026 が残ることがあります。手元では、@types/react が無いときと、preserve で types が無いときに残りました。JSX element implicitly has type 'any' の記事を見てください。
.ts のファイルでも、このエラーが出ますか?
.ts のファイルに JSX を書くと、TS17004 ではなく error TS1161: Unterminated regular expression literal. になりました。手元の出力では、エラーの位置は閉じタグ </h1> の / を指しました(理由を書いた公式の文は見つかっていません)。直し方は、Unterminated regular expression literal の記事にあります。
--ignoreConfig を付ければ直りますか?
直りません。--ignoreConfig は、見つけた tsconfig.json を無視して、コマンドのオプションとファイルで組み立てる設定です。TS5112 は出なくなりますが、tsconfig.json の jsx も読まれなくなります。付けたまま通すには、--jsx react-jsx を足します。
まとめ
- TS17004 は、
.tsxの JSX を、jsxの設定なしで調べたときの文です。TS7026 も同じ行に出ます - 直し方は、tsconfig.json の
compilerOptionsに"jsx": "react-jsx"を書くことです - 書いたのに出るときは、
tscにファイル名を渡していないかを見ます。TypeScript 6.0 以降は TS5112 で止まり、--ignoreConfigを付けるとjsxが読まれません - ファイル名を渡さずに、
npx tsc -p .(Vite のひな形はnpx tsc -b)で調べます - TypeScript 7.0.2 と 6.0.3 で、エラーの文は同じでした
この記事で確かめていないことは、次のとおりです。
- React Native・Expo・Next.js の画面での出方
- VS Code での出方
- TypeScript 5 系での動き
- Windows と macOS での動き
参考資料
- TypeScript Handbook: JSX
- TSConfig Reference: jsx
- TypeScript のコンパイラオプション(--jsx・--ignoreConfig)
- Announcing TypeScript 6.0(公式ブログ。ファイル名を渡したときの変更)
- React の文書: TypeScript を使う
※この記事は、2026年10月23日時点の公式の資料と照らして確かめています。誤りに気づいたらお問い合わせからお知らせください。



