🎃

typescriptで`'Stack.Navigator' cannot be used as a JSX component`エラー

に公開
TypeScript
tech

概要

react-native expo+react-navigation+native-baseのアプリで、どのタイミングでエラーが出始めたのかはっきりしませんが、native-baseをアップデートしたあたりでタイトルのエラーが出始めました。

コードの問題ではなく@types関連のエラーなので、コードは省略させていただきます。

解決策

package.jsonに"resolutions": { "@types/react": "~17.0.44" }を一行足してyarn installをしたら消えました。

解説

おそらくnative-baseをインストールした際に@types/reactが18系にアップグレードされて、そのせいでエラーが出始めたようです。

yarn.lockを見ると下記のようになっていました（元の状態を再現できなかったので何となく）。

"@types/react@*":
  version "18.0.??"
  dependencies:
    "@types/prop-types" "*"
    "@types/scheduler" "*"
    csstype "^3.0.2"

今回はreact-navigationでエラーが出ましたが、他でもちょいちょいエラーになってるっぽいですね。こちらが参考になりました。

Discussion