極速構成expo+react-native運転環境
7769 ワード
まずnodeおよびnpmをインストールする必要があります.次にnpmのグローバルprefixおよびcacheディレクトリを環境変数に追加し、npmのグローバルインストールの依存性をyarnなどの直接実行できるようにします.
ここでexpo+react-nativeを構成するには、
携帯電話端末をよりよく体験するためには、expoクライアントで閲覧することをお勧めします.アンドロイドとiosバージョンがあります.現在、iosバージョンはstoreから撤去されているようです.
より高速な依存インストールツール(実際には最初の依存インストール時にキャッシュされます)では、キャッシュディレクトリが大きくなりますが、yarnを使用して依存をダウンロードすることをお勧めします.
create-react-native-appを使用して、他の初期モジュールをプリセットしたプロジェクトディレクトリを作成することができます.個人的には、直接デフォルトで良いと思います.
途中npm installでプロセスが遅い場合は、yarnインストールプロジェクト依存を手動で使用することをお勧めします.
もちろん
起動するとdev-toolsのwebサーバが起動します.デフォルトのポートは19000ですが、このサーバはアプリケーションを傍受するためのサーバです.例えば、コードの一部にconsoleがあります.ロゴ、このサービスは印刷されます
コマンドラインが正常に実行されると、expoクライアントがスキャンしてアクセスできるQRコードであり、携帯電話で直接このアプリを実行することができるQRコードがあります.
expoクライアントは入力も可能exp://192.168.8.170:19000現在のサーバー・アドレス・アクセス
現在のプロジェクト作成packageを添付します.jsonおよびexpoクライアントバージョン
package.json
expoクライアントバージョン:2.15.4
create-react-native-app github公式サイトexpo cli足場github公式サイトexpo公式サイトreact-native公式サイトreact-native中国語網yarn cliコマンドヘルプドキュメント
ここでexpo+react-nativeを構成するには、
create-react-native-app
でプロジェクトディレクトリを作成し、expo-cli
でプロジェクトを開始し、プロジェクトをパッケージ化し、パブリッシュします.携帯電話端末をよりよく体験するためには、expoクライアントで閲覧することをお勧めします.アンドロイドとiosバージョンがあります.現在、iosバージョンはstoreから撤去されているようです.
yarn依存管理ツールのインストール
より高速な依存インストールツール(実際には最初の依存インストール時にキャッシュされます)では、キャッシュディレクトリが大きくなりますが、yarnを使用して依存をダウンロードすることをお勧めします.
$ npm i -g yarn
$ yarn global bin # yarn
$ yarn global dir # yarn
# :
$ yarn config set global-folder D:\env
odejs
ode_global
$ yarn config set cache-folder D:\env
odej
ode_cache
コマンドライン足場の取り付け
$ npm i -g create-react-native-app expo-cli exp
# yarn
$ yarn global add create-react-native-app expo-cli exp
プロジェクトディレクトリの作成
create-react-native-appを使用して、他の初期モジュールをプリセットしたプロジェクトディレクトリを作成することができます.個人的には、直接デフォルトで良いと思います.
$ npx create-react-native-app [ ]
> default
途中npm installでプロセスが遅い場合は、yarnインストールプロジェクト依存を手動で使用することをお勧めします.
うんてん
# npm
$ npm run android
$ npm run web
$ npm run ios
# yarn
$ yarn android
$ yarn web
$ yarn ios
もちろん
expo start --web
などのコマンドを直接使用することもできます起動するとdev-toolsのwebサーバが起動します.デフォルトのポートは19000ですが、このサーバはアプリケーションを傍受するためのサーバです.例えば、コードの一部にconsoleがあります.ロゴ、このサービスは印刷されます
コマンドラインが正常に実行されると、expoクライアントがスキャンしてアクセスできるQRコードであり、携帯電話で直接このアプリを実行することができるQRコードがあります.
expoクライアントは入力も可能exp://192.168.8.170:19000現在のサーバー・アドレス・アクセス
現在のプロジェクト作成packageを添付します.jsonおよびexpoクライアントバージョン
package.json
{
"main": "index.js",
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"expo": "~37.0.3",
"expo-splash-screen": "^0.2.3",
"expo-updates": "~0.2.0",
"react": "~16.9.0",
"react-dom": "~16.9.0",
"react-native": "~0.61.5",
"react-native-gesture-handler": "~1.6.0",
"react-native-reanimated": "~1.7.0",
"react-native-screens": "~2.2.0",
"react-native-unimodules": "~0.9.0",
"react-native-web": "~0.11.7"
},
"devDependencies": {
"@babel/core": "~7.9.0",
"babel-jest": "~25.2.6",
"jest": "~25.2.6",
"react-test-renderer": "~16.9.0"
},
"jest": {
"preset": "react-native"
},
"private": true
}
expoクライアントバージョン:2.15.4
リファレンスリンク
create-react-native-app github公式サイトexpo cli足場github公式サイトexpo公式サイトreact-native公式サイトreact-native中国語網yarn cliコマンドヘルプドキュメント