Windows_Router Memo/ReactNative Expo開発環境整備

ReactNative Expo開発環境整備(iPhoneのプログラム作成) †

WindowsでiPhoneアプリの開発ツールExpoの設定

事前準備 †

node.jsのインストール †

以下からDLしてPCにインストールする

• https://nodejs.org/ja

インストール確認 †

C:\Users\je2is> node --version
v18.15.0

C:\Users\je2is>npm --version
9.5.0

Expoのインストール †

C:\Users\je2is>npm install -g expo-cli
npm WARN deprecated stable@0.1.8: Modern JS already guarantees Array#sort() \
is a stable sort, so this library is deprecated. See the compatibility table \
on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
npm WARN deprecated uuid@3.4.0: Please upgrade  to version 7 or higher. \
Older versions may use Math.random() in certain circumstances, which is known \
to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated uuid@3.4.0: Please upgrade  to version 7 or higher.  \
Older versions may use Math.random() in certain circumstances, which is known \
to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated @npmcli/move-file@1.1.2: This functionality has been moved to @npmcli/fs
npm WARN deprecated uuid@3.4.0: Please upgrade  to version 7 or higher.  \
Older versions may use Math.random() in certain circumstances, which is known \
to be problematic.  See https://v8.dev/blog/math-random for details.

added 1171 packages in 2m

104 packages are looking for funding
  run `npm fund` for details
npm notice
npm notice New minor version of npm available! 9.5.0 -> 9.6.4
npm notice Changelog: https://github.com/npm/cli/releases/tag/v9.6.4
npm notice Run npm install -g npm@9.6.4 to update!
npm notice

参考画像

指示通りアップデート

C:\Users\je2is>npm install -g npm@9.6.4

added 1 package in 7s

18 packages are looking for funding
  run `npm fund` for details

Expoの確認 †

C:\Users\je2is>expo --version
WARNING: The legacy expo-cli does not support Node +17. Migrate to the versioned Expo CLI (npx expo).
6.3.2

サンプル作成 †

>expo init MyApp
WARNING: The legacy expo-cli does not support Node +17. Migrate to the versioned Expo CLI (npx expo).

以下の画面が表示されるの「blank」と無理やり入力する

「blank」を入力すると以下のような表示が始まる

Migrate to using:
? npx create-expo-app --template

√ Choose a template: ≫ blank               a minimal app as clean as an empty canvas 
√ Downloaded template.
?? Using npm to install packages.
/ Installing JavaScript dependencies.

  ↓（完了すると以下のようになる）

Migrate to using:
? npx create-expo-app --template

√ Choose a template: ≫ blank               a minimal app as clean as an empty canvas
√ Downloaded template.
?? Using npm to install packages.
√ Installed JavaScript dependencies.

? Your project is ready!

To run your project, navigate to the directory and run one of the following npm commands.

- cd MyApp
- npm start # you can open iOS, Android, or web from here, or run them directly with the commands below.
- npm run android
- npm run ios # requires an iOS device or macOS for access to an iOS simulator
- npm run web
Unable to initialize git repo. `git` not in PATH.

iphone に App store から「Expo Go」検索インストール †

「expo start」で開発サーバを立てる †

MyAppのディレクトリに移動して

> expo start

QRコードをiphoneのカメラで読む

以下のようなGRコードを読む

画面が以下のようにJavaScriptのビルドに変わる

完了すると以下のような表示になる

• MyApp\App.jsの内容が表示

参考 †

• https://qiita.com/BanaoLihua/items/33f05d368f9bbd0bb741