【React Native】Invariant Violation "main" has not been registered. This can happen if: *Metro (the local dev server ... の解決法


はじめに

自分の場合はとても処方的なミスでした (react-navigationが関係)
他にもいくつか試した対処法も載せてあります。

expoで開発していたら以下の様なエラーが起きた。

Invariant Violation "main" has not been registered. This can happen if: *Metro (the local dev server) 
is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.*
A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called.

環境

// app.json
   {
    "sdkVersion": "38.0.0"
   }
// package.json
  "dependencies": {
    "expo": "^38.0.8",
    "react-native": "^0.62.2",
    "react-navigation": "^4.4.3",
    "react-navigation-stack": "^2.10.0",
    "react-navigation-tabs": "^2.10.1",
   }

試した対処法

調べてみるといくつか方法があった

1つめ

  1. watchman watch-del-all
  2. node_modules & package-lock.json (もしくはyarn.lock) の削除
  3. npm install (もしくはyarn install)
  4. expo install react-native-safe-area-context
  5. expo start

試してみたが画面は変わらず。。

2つめ

  1. expoを止めている状態で、ps aux | grep react-native を実行して動いているプロセスを探す
  2. 結果が表示されたら、そのプロセスを sudo kill 'pid'

自分は動いてるプロセスは見つけたものの、killすると
kill:'pid': No such process
と出て解決には至らず。。

3つめ

package.jsonのnameとApp.jsonのexpoのnameを同じにする

→ 何も変わらず

自分の解決策

結局めちゃくちゃ初歩的なミスでした。。
react-navigationを使っている部分で、 createAppContainerを呼んでいるが、肝心のimportをし忘れていた為、エラーが起こっていた様です。

今回のような場合だけでなく

// ここを書き忘れていた
// import { createAppContainer } from "react-navigation";

 const AppContainer = createAppContainer(HomeTab);

普段こんな場合は
ReferenceError: Can't find variable: Button
とかでエラーが出ると思うのですが。。。

importの部分を書き足すと正常に動作しました。

ルーティング周りで変更を加えた場合は、そこの箇所を戻してみると治るかもしれません。

2020/11/14 追記
export default class Index extends React.Component{}

この部分を

export default class Index extends React.Component(){}

と不要な()をつけてしまった為、同じエラーが起きた。

おそらく特定のパターンに絞れないエラーなので、まずはコードに間違いが無いか確認してみると良いと思います。

メモ

expo start --no-dev --minifyで起動すると解決する」
とexpoのForumsにあったので、試してみると確かに一時的に解決した。
Forums

しかしこれはproduction用にアプリをminifyして不要な部分を削っている為、部分的に解決しただけだと思われる。
expo -Development and Production Mode