寫此文，我會(huì)嚴(yán)格按照我配置的過程寫譬胎，如果你選擇按照我的安肛循，每一步都要一樣，以免報(bào)錯(cuò)
如果你嚴(yán)格按照我說的配银择，仍然出錯(cuò)了多糠，歡迎留言，我們一塊解決浩考。
現(xiàn)在裝rn的環(huán)境越來簡(jiǎn)單了夹孔，可能是我熟悉了，可能最大的阻礙是有一些包下載的時(shí)候出現(xiàn)超時(shí)析孽，這個(gè)時(shí)候你可以考慮切換成淘寶的搭伤，包含npm和android都是有相關(guān)的。
根據(jù)ReactNative0.57進(jìn)行配置的袜瞬，ReactNative最高支持Android8.1怜俐，以后會(huì)更新
更新日記（2021年1月28日）：自0.60以后，運(yùn)行rn項(xiàng)目不再通過react-native的方式邓尤，而是通過yarn或者npx拍鲤；在裝包的時(shí)候不需要手動(dòng)link了贴谎，已經(jīng)支持自動(dòng)link了。ios端使用pod的方式了季稳，所以在跑ios之前需要進(jìn)入ios的文件夾下執(zhí)行pod install擅这，如果提示你沒有安裝，你安裝以后繼續(xù)即可景鼠。
一仲翎、進(jìn)入ReactNative的官網(wǎng)
1.下載nodejs、python和JDK
百度網(wǎng)盤下載地址
- nodejs
- python2.7
-
JDK1.8
注意說明的是铛漓，就是官網(wǎng)說的那樣溯香，python只能是2.x
現(xiàn)在對(duì) java 的版本也升級(jí)了，不僅僅是 1.8 版本了浓恶。
官網(wǎng)地址（推薦）
二逐哈、安裝上面的三個(gè)包
這三個(gè)包的安裝都跟安裝QQ一樣，盡量不要更改盤符问顷；在安裝 python 的過程中可能會(huì)遇到 python to PATH 的字樣，如果這個(gè)旁邊有一個(gè)×禀梳，那么需要點(diǎn)進(jìn)去換成第一個(gè)杜窄，這樣就自動(dòng)將環(huán)境配置好；安裝完成以后打開終端 win+r 打開“運(yùn)行”對(duì)話框算途，輸入 cmd 回車塞耕，即可打開終端，在 windows 系統(tǒng)上叫提示符嘴瓤。
node --version
# 如果顯示像 v10.15.0 這樣的就代表成功
python --version
java -version
# 跟 nodejs 相同
這樣就配置成功了扫外，接下來安裝react-native cli。
三廓脆、安裝react-native
這個(gè)也是一樣按照官方配置即可筛谚，我這里就復(fù)制復(fù)制。
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
npm install -g yarn react-native-cli
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global
注意：現(xiàn)在官方推薦使用 npx 的方式停忿，差別不大驾讲，只不過是在運(yùn)行的時(shí)候在前面添加npx或者yarn而已，其他并沒有什么區(qū)別席赂。
通過以上幾步已經(jīng)成功安裝好了ReactNative了
四吮铭、安裝android studio
網(wǎng)盤下載地址：android studio3.1
android 官網(wǎng)下載地址
五、配置Android studio
官網(wǎng)里面說的很明白颅停，就是嚴(yán)格按照上面的進(jìn)行配置谓晌，千萬不要投機(jī)取巧，每一步都不能蜀唷纸肉；我需要說明的是溺欧，在進(jìn)入 Android SDK以后，嚴(yán)格按照上面的進(jìn)行勾選毁靶，如果本身就勾選了其他的胧奔，你可以不管，只需要將要求的勾選上预吆，其余的不動(dòng)龙填。
下面的那一步，也就是配置ANDROID_HOME拐叉，這一步不能少岩遗，不管你是真機(jī)測(cè)試還是模擬器測(cè)試，這一步都是必須的凤瘦，當(dāng)然上面要求的都是必須的宿礁。
我把上面的工作做完成以后，我就新建了一個(gè)react-native項(xiàng)目蔬芥。
react-native init TestApp --version 0.57.0
# 或
npx react-native init TestApp --version 0.61.3
這條命令的后面--version 0.57.0是指定版本號(hào)梆靖，如果不寫，那么創(chuàng)建的是最新版的RN項(xiàng)目笔诵。
完成以后返吻，使用 android studio 打開了項(xiàng)目下的 android 文件夾，然后等待乎婿，直到上面的運(yùn)行可以點(diǎn)擊即可测僵，可以點(diǎn)擊以后就選擇運(yùn)行，然后選擇模擬器谢翎，默認(rèn)的即可捍靠；模擬器啟動(dòng)完成以后會(huì)自動(dòng)打開項(xiàng)目，此時(shí)我的并沒有成功森逮。
接下來我打開命令行提示符榨婆，在這里說這條命令行提示符的命令：
cd dir切換到dir目錄下
dir查看當(dāng)前文件夾下所有的文件，包括隱藏文件
這兩條命令足夠我們使用了褒侧，其余的可以自學(xué)纲辽，也可以使用界面的方式進(jìn)行操作。
進(jìn)入到剛創(chuàng)建的項(xiàng)目下璃搜，必須要在創(chuàng)建的項(xiàng)目下拖吼，輸入：
# 低版本 0.60 之前安裝的 react-native
react-native run-android
# 或 0.60 發(fā)布以后都統(tǒng)一使用下面的命令啟動(dòng)
npx react-native run android
# 或
yarn android
# 或
npm run android
回車，然后等待命令行提示符出現(xiàn)可以輸入命令的狀態(tài)这吻，此時(shí)可以看到nodejs的終端打開吊档，而且打開的端口號(hào)是8081，但是此時(shí)并沒有跑起來唾糯，此時(shí)找到模擬器里面剛安裝的APP怠硼，這時(shí)就會(huì)看到nodejs終端里面跑起來了鬼贱，等待跑完，跑到100%就能成功香璃；到這兒我的都很順利这难。
使用真機(jī)測(cè)試
- 接下來我嘗試使用真機(jī)測(cè)試，使用真機(jī)測(cè)試需要打開開發(fā)者選項(xiàng)葡秒，每一種手機(jī)打開的方式不同姻乓，可以根據(jù)自己的手機(jī)查看；
- 如果你成功的完成了上面的操作眯牧，那么后面的就是使用數(shù)據(jù)線插到電腦上蹋岩，此時(shí)可能會(huì)彈出一個(gè)對(duì)話框，選擇存儲(chǔ)学少，如果沒有剪个，可以選擇滑下狀態(tài)欄看看有沒有，如果有就更改版确，如果以上兩種都沒有扣囊，那么說明你的數(shù)據(jù)線可能插得不好，或者不支持绒疗。
- 進(jìn)入開發(fā)者選項(xiàng)里面侵歇，打開USB調(diào)試，
- 打開以后可能會(huì)彈出一個(gè)對(duì)話框忌堂，你選擇確認(rèn)即可；
- 在項(xiàng)目中同樣運(yùn)行上面的命令
yarn android 或 react-native run android酗洒；
直到手機(jī)上出現(xiàn)顯示的結(jié)果士修，雙擊r刷新，如果成功樱衷，可以打開項(xiàng)目里面App.js棋嘲，對(duì)里面的內(nèi)容進(jìn)行修改，然后選擇模擬器矩桂，雙擊r沸移，看看刷不刷新；我的到這兒出現(xiàn)了錯(cuò)誤：
Unable to load script from assets 'index.android.bundle'. Make sure your bundle is packaged correctly or you're running a packager server侄榴？
就是這樣的錯(cuò)誤雹锣，按照下面的博客進(jìn)行操作即可成功，Unable to load script from assets 'index.android.bundle'. Make sure your bundle is packaged correctly or you're running a packager server癞蚕？
需要說明的是：里面的那一條命令：
react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
上面的index.js這個(gè)的看自己的項(xiàng)目蕊爵，如果項(xiàng)目中有index.android.js和index.ios.js就將上面的替換成index.android.js
可能你通過網(wǎng)上的很多資料，看到可能說因?yàn)槟汶娔X上沒有安裝adb驅(qū)動(dòng)桦山，此時(shí)你首先看一看你的手機(jī)能不能連接電腦攒射，如果能醋旦，說明并不是這里的原因。
到這里你可能不能實(shí)時(shí)刷新会放，這樣的話饲齐，參照這個(gè)博客React-Native項(xiàng)目在Android真機(jī)上調(diào)試
六、配置VScode咧最，使其支持RN
安裝完成以后捂人，你編寫代碼能夠提高開發(fā)效率，下面是一個(gè)別人寫的博客的地址窗市，非常感謝他先慷，配置VScode開發(fā)reactNative
七、使用android studio 打包可能會(huì)出現(xiàn)跟圖片相關(guān)的問題
下面這個(gè)使解決方案咨察，解決圖片問題：android studio 打包出現(xiàn)圖片問題论熙，使用此教程，如果使其他問題摄狱，先clean脓诡，然后重新生成index.android.bundle，生成命令在上面媒役。
在博客中使用的所有其他的博客祝谚，我表示對(duì)你們的感謝，是你們幫我解決了很多很多問題酣衷，同時(shí)我也希望交惯，各位能夠說出我的不是。
七穿仪、使用VScode開啟debug模式
配置debug模式網(wǎng)上很多教程席爽，也比較簡(jiǎn)單，就是下載擴(kuò)展啊片，搜索react-native-tools只锻，安裝，然后點(diǎn)開debug紫谷，第一次可能提示沒有配置debug齐饮，這個(gè)需要配置，選擇配置笤昨，這個(gè)時(shí)候可能會(huì)出現(xiàn)一個(gè)文件祖驱，也有可能出現(xiàn)一個(gè)選擇的對(duì)話框，出現(xiàn)對(duì)話框直接選擇react-native即可瞒窒，如果直接出現(xiàn)文件羹膳，launch.json文件，注意看文件右下角有一個(gè)“Add Configuration”根竿，點(diǎn)擊即可陵像，然后選擇debug android或debug ios就珠，這樣就可以了，至于出現(xiàn)的那些參數(shù)的含義醒颖，react-native-tools里面有說明妻怎，一般不需要特別配置里面的參數(shù)就能使用，默認(rèn)跟在終端中使用react-native run-android差不多泞歉，配置好了以后再進(jìn)入debug中逼侦，選擇你配置中的那一項(xiàng)即可，然后等待啟動(dòng)腰耙，榛丢，如果出現(xiàn)錯(cuò)誤react-native ERROR EPERM: operation not permitted，則按照下面這個(gè)博客的方法進(jìn)行即可挺庞，我得提醒的是晰赞，在這開始之前，配置環(huán)境中的任何一步都走得對(duì)选侨，如果仍然不行可以檢查是不是有一步漏走了掖鱼。react-native ERROR EPERM: operation not permitted解決方案
