Windows下的React-Native開發調試環境安裝
初學React-Native,需要搭建一套開發環境。
教程視頻中老師用的是Mac,我用的Window,在說環境配置的時候基本是一臉懵逼
本以爲React是開發一套,IOS和Android都能跑。看了視頻後,我突然感覺React還是傾向於IOS一些
環境搭建
Windows 不像 Mac 上那麼簡單,也只能面向 Android 去做選擇。
既然是面向 Andorid,那麼 Java 環境是必不可少的。
Java
項 | 值 |
---|---|
JAVA_HOME | C:\Program Files\Java\jdk1.8.0_151 |
CLASSPATH | .;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar |
PATH | %JAVA_HOME%\bin;%JAVA_HOME%\jre\bin |
Android SDK
推薦通過 Android Studio 一併進行安裝下載
配置 Android SDK 的環境變量,在系統的環境變量中添加
項 值 ANDROID_HOME D:\android-sdk-windows PATH %ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools) - 注意項
- 關於 Android SDK 裏,這些是必裝選項
Node.js
必裝選項下載地址。推薦msi版本
安裝成功後,通過 命令提示符 (Ctrl+R,”cmd”),安裝 react-native-cli
在安裝 react-native-cli 之前,推薦先進行如下操作
使用國內鏡像源加速
npm config set registry=https://registry.npm.taobao.org
安裝 yarn
npm install -g yarn
yarn 配置國內鏡像源加速
yarn config set registry https://registry.npm.taobao.org
安裝 react-native-cli
npm install -g react-native-cli
Genymotion
安卓的模擬器,很多都推薦用這個模擬器,Android Studio有模擬器,所以這個 非必須
好不好用不敢說,只能說比較卡
需要安裝 VirtualBox (推薦最新版),Genymotion需要註冊賬號。
創建項目
還是使用 命令提示符 ,切換到保存項目的目錄,輸入:
React-native init [項目名稱]
開始項目
通過 命令提示符 啓動項目,啓動後是作爲服務存在,不要隨意關閉
react-native start
開啓服務後,可以通過 http://localhost:8081/index.android.bundle?platform=android 查看情況,會顯示大篇幅的JS
Android 調試
項目所在目錄,開啓 命令提示符 啓動Android調試
react-native run-android
第一次運行時會安裝較多的包,會安裝在 我的文檔 的 .gradle文件夾中。
我已經將視頻刪除,多看文檔吧。