react_native環(huán)境搭建

0 環(huán)境搭建

根據(jù)http://reactnative.cn/docs/0.41/getting-started.html#content

1. 安裝Chocolatey, cmd輸入

    @powershell -NoProfile -ExecutionPolicy Bypass -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin

2. 安裝Python2(不支持3), 使用Chocolatey安裝, cmd輸入

    choco install python2

3. 安裝Node(避開Node7.0以上版本,手動(dòng)下載), 使用Chocolatey安裝, cmd輸入,

choco install nodejs.install

建議手動(dòng)下載安裝低版本node

4. 安裝yarn(facebook替代npm的工具, 加速node模塊下載), 以及ReactNative的命令行工具react-native-cli

npm install -g yarn react-native-cli

5. 安裝git,Android Studio和JDK

choco install jdk8
choco install git

  • jdk1.8及以上

  • Android Studio

    • 需2.0以上,安裝選項(xiàng)盡量別動(dòng)

    • 需選擇Android SDK和Android Device Emulator, Android Support Repository

    • Custom模式安裝


    • 安裝組件需有模擬器和HAXM加速


    • 初次進(jìn)入時(shí)選擇Configure | SDK Manager,

    • 在SDK Platforms窗口中，選擇Show Package Details，然后在Android 6.0 (Marshmallow)中勾選Google APIs、Android SDK Platform 23、Intel x86 Atom System Image、Intel x86 Atom_64 System Image以及Google APIs Intel x86 Atom_64 System Image。

    • 在SDK Tools窗口中，選擇Show Package Details，然后在Android SDK Build Tools中勾選Android SDK Build-Tools 23.0.1（必須是這個(gè)版本）。

    • 然后還要勾選最底部的Android Support Repository.


6. 配置sdk路徑為ANDROID_HOME的環(huán)境變量

  • 命令行窗口需要全部關(guān)掉重開才可應(yīng)用

7. 測(cè)試安裝

react-native init AwesomeProject
cd AwesomeProject
react-native run-android

問題1 報(bào)錯(cuò)"Command yarn add react-native --exact failed."

  • 解決方法
    • 安裝7.0以下node.js

問題2 adb devices找不到genymotion

  • 解決方法
    • 將setting里的adb路徑改成自帶sdk的路徑,而不是default

問題3 Could not install the app on the device, read the error above for details.

Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:https://facebook.github.io/react-native/docs/android-setup.html
  • 解決方法
    • 檢查下Android_Home的路徑

問題4 小米關(guān)閉"通過usb驗(yàn)證應(yīng)用程序"

  • 解決方法
    • 本身是無(wú)法選擇的,安裝google框架后即可

問題4 Failed to establish session

  • 小米系統(tǒng)的MIUI優(yōu)化功能會(huì)在代碼安裝apk時(shí)彈出一個(gè)提示框,然而RN會(huì)自動(dòng)打包安裝到手機(jī),這個(gè) "自動(dòng)安裝" 的過程不會(huì)喚醒提示框,所以默認(rèn)拒絕.
  • 解決方法

問題5 安裝后白屏

  • 解決方法
    • 權(quán)限里開啟"懸浮窗權(quán)限"即可

問題6 安裝后紅屏

  • 解決方法
    • 搖一搖手機(jī),彈出懸浮窗,點(diǎn)擊Dev Settings 然后點(diǎn)擊 Debug server host & port for devices
    • 輸入電腦ip(cmd->ipconfig -> 本地連接的ipv4地址,或者打開網(wǎng)絡(luò)和共享中心 -> 本地連接 -> 詳細(xì)信息 -> ipv4地址)+固定端口號(hào)8081,即格式為xxx.xxx.xxx.xxx:8081
    • 回到空白界面, 再次搖一搖手機(jī), 選擇Reload,出現(xiàn)Welcome to React Native!

問題7 模擬器

  • 如果使用Genymotion需要setting -> ADB -> use customAndroid SDK tools,選擇本地的sdk

問題8 未解決紅米note2的安裝問題

:app:packageDebug UP-TO-DATE
:app:assembleDebug UP-TO-DATE
:app:installDebug
Installing APK 'app-debug.apk' on 'Redmi Note 2 - 5.0.2' for app:debug
Unable to install D:\rn\AwesomeProject\android\app\build\outputs\apk\app-debug.a
pk
com.android.ddmlib.InstallException: Failed to install all
        at com.android.ddmlib.SplitApkInstaller.install(SplitApkInstaller.java:8
9)
        at com.android.ddmlib.Device.installPackages(Device.java:904)
        at com.android.builder.testing.ConnectedDevice.installPackages(Connected
Device.java:137)
        at com.android.build.gradle.internal.tasks.InstallVariantTask.install(In
stallVariantTask.java:134)
        at org.gradle.internal.reflect.JavaMethod.invoke(JavaMethod.java:75)
        at org.gradle.api.internal.project.taskfactory.AnnotationProcessingTaskF
actory$StandardTaskAction.doExecute(AnnotationProcessingTaskFactory.java:228)
        at org.gradle.api.internal.project.taskfactory.AnnotationProcessingTaskF
actory$StandardTaskAction.execute(AnnotationProcessingTaskFactory.java:221)
        at org.gradle.api.internal.project.taskfactory.AnnotationProcessingTaskF
actory$StandardTaskAction.execute(AnnotationProcessingTaskFactory.java:210)
        at org.gradle.api.internal.AbstractTask$TaskActionWrapper.execute(Abstra
ctTask.java:621)
        at org.gradle.api.internal.AbstractTask$TaskActionWrapper.execute(AbstractTask.java:604)
        at org.gradle.api.internal.tasks.execution.ExecuteActionsTaskExecuter.ex
ecuteAction(ExecuteActionsTaskExecuter.java:80)
        at org.gradle.api.internal.tasks.execution.ExecuteActionsTaskExecuter.ex
ecuteActions(ExecuteActionsTaskExecuter.java:61)
        at org.gradle.api.internal.tasks.execution.ExecuteActionsTaskExecuter.ex
ecute(ExecuteActionsTaskExecuter.java:46)
        at org.gradle.api.internal.tasks.execution.PostExecutionAnalysisTaskExec
uter.execute(PostExecutionAnalysisTaskExecuter.java:35)
        at org.gradle.api.internal.tasks.execution.SkipUpToDateTaskExecuter.exec
ute(SkipUpToDateTaskExecuter.java:66)
        at org.gradle.api.internal.tasks.execution.ValidatingTaskExecuter.execut
e(ValidatingTaskExecuter.java:58)
        at org.gradle.api.internal.tasks.execution.SkipEmptySourceFilesTaskExecu
ter.execute(SkipEmptySourceFilesTaskExecuter.java:52)
        at org.gradle.api.internal.tasks.execution.SkipTaskWithNoActionsExecuter
.execute(SkipTaskWithNoActionsExecuter.java:52)
        at org.gradle.api.internal.tasks.execution.SkipOnlyIfTaskExecuter.execut
e(SkipOnlyIfTaskExecuter.java:53)
        at org.gradle.api.internal.tasks.execution.ExecuteAtMostOnceTaskExecuter
.execute(ExecuteAtMostOnceTaskExecuter.java:43)
        at org.gradle.execution.taskgraph.DefaultTaskGraphExecuter$EventFiringTa
skWorker.execute(DefaultTaskGraphExecuter.java:203)
        at org.gradle.execution.taskgraph.DefaultTaskGraphExecuter$EventFiringTaskWorker.execute(DefaultTaskGraphExecuter.java:185)
        at org.gradle.execution.taskgraph.AbstractTaskPlanExecutor$TaskExecutorW
orker.processTask(AbstractTaskPlanExecutor.java:66)
        at org.gradle.execution.taskgraph.AbstractTaskPlanExecutor$TaskExecutorW
orker.run(AbstractTaskPlanExecutor.java:50)
        at org.gradle.internal.concurrent.ExecutorPolicy$CatchAndRecordFailures.
onExecute(ExecutorPolicy.java:54)
        at org.gradle.internal.concurrent.StoppableExecutorImpl$1.run(StoppableE
xecutorImpl.java:40)
04:01:06 E/1102664595: Error while uploading app-debug.apk : Unknown failure ([C
DS]close[0])
:app:installDebug FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:installDebug'.
> com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallExc
eption: Failed to install all

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug
option to get more log output.

BUILD FAILED

Total time: 9.999 secs
Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/android-setup.html

D:\rn\AwesomeProject>
  • 狀況:
    • 只在紅米note2上出現(xiàn),系統(tǒng)是muui8.0,android 5.0.2
    • 同款5.0.2moto手機(jī)沒問題
    • 6.0的米和7.0的華為沒問題
    • 已關(guān)閉了miui優(yōu)化
  • 嘗試解決:
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,062評(píng)論 25贊 709
  • 一、安裝HomeBrew Homebrew 是 OS X 或者 macOS 的套件管理器，我們可以通過它來(lái)獲取并安...
    厲害了我的國(guó)閱讀 1,216評(píng)論 2贊 5
  • mac相對(duì)比較容易，首先安裝包管理器brew（強(qiáng)烈推薦，也可手動(dòng)安裝），然后安裝nodejs，Xcode 7+。 ...
    kaenry閱讀 755評(píng)論 1贊 0
  • 今天是家里小妹大婚的日子，所以一天都帶著娃娃在外面浪了，晚上回來(lái)的也晚，洗洗趕緊讓祂睡了，所有的打卡我來(lái)完成的。 ...
    Hisi閱讀 243評(píng)論 0贊 0
  • 姚記早點(diǎn)開在一座老舊的居民樓里，，只有兩個(gè)人，姚大爺和他的老伴兒。 初次去姚記吃早點(diǎn)，是我回到家鄉(xiāng)工作的時(shí)候。那時(shí)...
    村口小酒館閱讀 524評(píng)論 0贊 1

友情鏈接更多精彩內(nèi)容