Expoの開発画面がExpo webとなってしまう
解決済
回答 2
投稿
- 評価
- クリップ 0
- VIEW 509
前提・実現したいこと
Expoを利用してスマホアプリを開発しています。
アプリ内で画面遷移を行うために、React Navigationを利用したいです。
公式のdocumentを参考にして、必要なパッケージをインストールしているのですが、以下のコマンドを行うと、その後開発の画面が、Expo webを利用する表示となってしまいます。
npm install @react-navigation/native
サーバーを立ち上げる以下のコマンドを行うと、
expo start
以下の表示となります。
┌───────────────────────────────────────────────────────────────────────────────────────────┐
│ │
│ Expo web is in beta, please report any bugs or missing features on the Expo repo. │
│ You can follow the V1 release for more info: https://github.com/expo/expo/issues/6782 │
│ │
└───────────────────────────────────────────────────────────────────────────────────────────┘
React You can now view test-app in the browser.
Local: http://localhost:19006/
On Your Network: http://xxx.xxx.xxx.xx:19006/
Note that the development build is not optimized.
› To create a production build, run expo build:web
› Press w to open the project in browser.
› Press Ctrl+C to exit.
Expo Press ? to show a list of all available commands.
シュミレーターを利用した、表示もできるのですが、ブラウザー内で表示する形となってしまい、通常のネイティブでの表示と変わってしまいます。
React Navigationを利用する際に、通常どおりの表示になる方法についてご存知の方おりましたら、ご教授いただけないでしょうか?
補足情報(FW/ツールのバージョンなど)
node: v12.18.3
React Navigation: 5.x
expo : 3.22.3
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 過去に投稿した質問と同じ内容の質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
check解決した方法
0
自己解決できましたので、行った方法を載せます。
react navigationのインストール
npm install @react-navigation/native
expo install react-native-gesture-handler react-native-reanimated react-native-screens react-native-safe-area-context @react-native-community/masked-view
npm install @react-navigation/stack
package.json修正
expo : 38.0.8 → 37.0.0
react-nativ : 38.0.2 →37.0.1
nodeの再インストール
npm install
こちらのエラー対応のため、expoのupdate
Invariant Violation: requireNativeComponent: "RNCSafeAreaProvider" was not found in the UIManager.
expo update
投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
0
React Nativeを最近いじり始め、同様のエラーに困っていたので助かりました。ありがとうございます!
こちらは結局、何がいけなかったのでしょうか?
投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
15分調べてもわからないことは、teratailで質問しよう!
- ただいまの回答率 88.37%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる