Expo PR

【expo】React.createElement: type is invalidで動かない時

記事内に商品プロモーションを含む場合があります

今回は、React NativeをExpoでアプリを作っている際に下記のエラーについて起きたので、解説します

Warning: React.createElement: type is invalid — expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it’s defined in, or you might have mixed up default and named imports.

エラーの原因:React.createElement: type is invalid

このエラーはReact NavigationのcreateElementを利用する際に、設定を間違えると起きます。

react navigationは、V4, V5で実装が大きく異なり、今回はV5を利用して解決をしたため、V5について記載します。

また、5系からはReactのバージョンが大きくアップデートしたという背景もあり、Functional Componentがドキュメントでは採用されていますが、私はClass Componentを利用していたため、Class Componentで記載しますね!

エラー解決:React.createElement: type is invalid

原因は簡単でした!

stackviewや、tabviewで下のnameの箇所が、異なっているとエラーになります

    <Stack.Navigator>
      <Stack.Screen name="お気に入り" component={Home} />
      <Stack.Screen name="詳細" component={Detail} />
    </Stack.Navigator>

nameが合っているか、再度確認してみてください