React Native の環境構築方法
環境情報
- MacBook Air M1, 2020
- node 16.14.0
- expo 6.3.10
- create-expo-app 2.0.4
手順
Expo をインストールする
npm i -g expo-cli下記コマンドでバージョンが表示されればOK。
expo --versionCreate Expo App をインストールする
npm i create-expo-app下記コマンドでバージョンが表示されればOK。
npx create-expo-app -vプロジェクトを作成する
react-native-tutorial は任意のプロジェクト名に変更する。
npx create-expo-app react-native-tutorial -t expo-template-blank-typescript起動する
※デバッグ用アプリのインストールが必要
下記コマンドを実行する。
npm run startターミナル上にQRが表示されるので、デバッグ用デバイスで読み取ると確認ができる。
その他起動方法
Android Studioエミュレーター
※Android Studio のインストールと設定が必要
▼設定方法
https://docs.expo.dev/workflow/android-studio-emulator/
npm run androidMacのiOSシミュレータ
※XcodeとXcodeコマンドラインツールをインストール
が必要
▼設定方法
https://docs.expo.dev/workflow/ios-simulator/
npm run iosWeb
npm run webトラブルシューティング
npm run webでエラーが出る
筆者の環境では、下記のようなエラーが発生。
CommandError: It looks like you're trying to use web support but don't have the requireddependencies installed.
Please install react-native-web@~0.19.6, react-dom@18.2.0,@expo/webpack-config@^19.0.0 by running:
npx expo install react-native-web@~0.19.6 react-dom@18.2.0@expo/webpack-config@^19.0.0
If you're not using web, please ensure you remove the "web" string from theplatforms array in the project Expo config.下記コマンドで不足しているパッケージをインストール。
npx expo install react-native-web@~0.19.6 react-dom@18.2.0npx expo install @expo/webpack-config@^19.0.0その後再度npm run webを実行で無事に起動。
