🎃

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

2022/04/16に公開

概要

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