告訴大家一個(gè)好消息秕狰，為大家精心準(zhǔn)備的React Native視頻教程發(fā)布了帘皿，大家現(xiàn)可以看視頻學(xué)React Native了东跪。
React Native作為一個(gè)有上千開(kāi)發(fā)者參與的開(kāi)源項(xiàng)目，自從2015年3月27日第一版發(fā)布以來(lái)到現(xiàn)在已經(jīng)有147次版本發(fā)布了鹰溜，平均起來(lái)幾乎每周都會(huì)有新的版本發(fā)布虽填。隨著一次次版本的迭代，React Native也逐漸穩(wěn)定曹动，版本發(fā)布頻率保持在了每一到兩周一次斋日。新版本不停的迭代對(duì)于React Native開(kāi)發(fā)者來(lái)說(shuō)，及時(shí)升級(jí)React Native版本讓項(xiàng)目能夠使用更多的API仁期、新特性以及淘汰掉一些老的API桑驱，不僅成為了一門必修課也是一個(gè)不小的挑戰(zhàn)。
升級(jí)一個(gè)React Native項(xiàng)目不僅需要JS部分還牽扯到Android項(xiàng)目和iOS項(xiàng)目跛蛋，盡管React Native官方極力降低升級(jí)的繁瑣熬的，但如果兩個(gè)React Native版本跨度較大的話升級(jí)起來(lái)還是需要不少工作量的。在這篇文章中我將向大家分享React Native升級(jí)的流程指南以及我在升級(jí)React Native過(guò)程中的一些經(jīng)驗(yàn)心得赊级。
React Native升級(jí)流程
React Native升級(jí)流程可分為三大步：
- 安裝
react-native-git-upgrade模塊押框； - 執(zhí)行更新命令；
- 解決沖突理逊；
心得：上述步驟都依賴于Git,沒(méi)有安裝Git客戶端的小伙伴橡伞，需要安裝一下。
1.安裝react-native-git-upgrade 模塊
首先我們需要安裝react-native-git-upgrade 模塊晋被，打開(kāi)終端執(zhí)行下面命名即可：
$ npm install -g react-native-git-upgrade
安裝成功后兑徘，會(huì)看到下圖輸出：
心得：react-native-git-upgrade是一個(gè)命令行界面的工具，我們需要將它安裝到全局羡洛，所以通過(guò)
npm install命令安裝的時(shí)候需要加上-g這個(gè)參數(shù)挂脑。
2.執(zhí)行更新命令
安裝過(guò)react-native-git-upgrade工具之后，我們就可以通過(guò)它來(lái)更新我們項(xiàng)目的React Native版本了，通過(guò)運(yùn)行下面命令即可完成更新：
$ react-native-git-upgrade
通過(guò)這個(gè)命令可以將React Native更新到最新的版本崭闲，但不是預(yù)發(fā)布版哦肋联。
心得：我們需要在React Native項(xiàng)目的根目錄下執(zhí)行更新命令，也就是package.json所在的目錄刁俭。
如果想更新到指定版本的React Native則需要在上述命令后加上指定版本的參數(shù)橄仍，如下：
$ react-native-git-upgrade X.Y.Z
這樣以來(lái)，React Native便會(huì)被更新到X.Y.Z版牍戚，在運(yùn)行這個(gè)命令時(shí)侮繁，需要將X.Y.Z替換成具體的版本。
更新命令執(zhí)行成功之后翘魄，你會(huì)從終端看到如下輸出：
從終端的輸出中我們可以看出斋射，更新的全過(guò)程以及我們所更新到的React Native版本腹躁。
另外，我們通過(guò)Version Control可以看出此次更新后發(fā)生變化的文件：
3.解決沖突
需要特別提到的是react-native-git-upgrade工具在更新React Native版本的時(shí)候會(huì)進(jìn)行一個(gè)合并操作炕淮，也就是將我們本地的React Native版本和最新或指定的React Native版本進(jìn)行合并们镜，在合并過(guò)程中可能會(huì)產(chǎn)生一些沖突，在終端的輸出中我們能清晰的看出發(fā)生沖突的文件：
從上圖中我們可以看到AppDelegate.m與project.pbxproj發(fā)生了沖突反砌，所以接下來(lái)我們需要處理發(fā)生沖突的文件晶疼。
心得：一般來(lái)說(shuō)寒匙，React Native版本跨度越大考蕾，產(chǎn)生沖突的可能性也就越大。
在處理沖突的時(shí)候通常我們會(huì)保留最新的代碼移除老的代碼，但具體還是要看了代碼的具體功能后在做處理，比如，在上圖中我們需要移除#import "RCTBundleURLProvider.h"與#import "RCTRootView.h"保留#import <React/RCTBundleURLProvider.h>、#import <React/RCTRootView.h>以及#import "SplashScreen.h",為什么要保留#import "SplashScreen.h"呢态辛，這是因?yàn)椋?code>#import "SplashScreen.h"是我們添加的，并不屬于React Native的一部分挺尿。
心得：另外一個(gè)需要特別提到的就是xxx.xcodeproj文件夾下所產(chǎn)生的沖突文件了奏黑，比如
project.pbxproj炊邦，xxx.xcodeproj文件夾下存放的是整個(gè)iOS項(xiàng)目的一些配置文件，在處理這些文件沖突的時(shí)候我們需要特別注意文件的格式熟史，處理不當(dāng)很有可能導(dǎo)致真?zhèn)€iOS項(xiàng)目無(wú)法打開(kāi)馁害。
當(dāng)處理完沖突后如果在打開(kāi)iOS項(xiàng)目時(shí)出現(xiàn)the project file cannot be parsed錯(cuò)誤：
則很可能是在處理xxx.xcodeproj文件夾下的沖突的時(shí)候破壞了文件的結(jié)構(gòu)，導(dǎo)致XCode無(wú)法解析相應(yīng)文件蹂匹，要解決這個(gè)問(wèn)題則需要找到出現(xiàn)問(wèn)題的文件將被破壞的文件結(jié)構(gòu)修復(fù)好碘菜。
到這里整個(gè)更新流程便走完了，現(xiàn)在我們便可以使用以及體驗(yàn)React Native最新版本的API以及特性了限寞。
心得：雖然我們完成了React Native的整個(gè)更新流程忍啸，但我們這個(gè)時(shí)候還需要運(yùn)行一下我們的React Native項(xiàng)目，然后看一下各個(gè)功能是否正常履植，因?yàn)楹苡锌赡芪覀冊(cè)陧?xiàng)目中所使用的一些舊版的API在新版的React Native中已經(jīng)被移除了计雌，所以我們需要及時(shí)的更新被移除或被棄用的API。關(guān)于每一個(gè)版本所發(fā)生的具體變化我們可以查閱：React Native項(xiàng)目的發(fā)布說(shuō)明
玫霎。
React Native v0.40+升級(jí)適配經(jīng)驗(yàn)與心得
在2017年1月初凿滤，React Native發(fā)布了v0.40版本，并起名為December 2016鼠渺，這也是2016年的最后一個(gè)版本鸭巴。和以往一樣每次React Native整版的發(fā)布都會(huì)帶來(lái)一些大的變更，這次也不例外拦盹。在這篇文章中鹃祖，我將向大家分享React Native v0.40對(duì)開(kāi)發(fā)者影響比較大的變更以及升級(jí)到v0.40的一些經(jīng)驗(yàn)心得。
關(guān)于如何升級(jí)React Native項(xiàng)目普舆，可參考[React Native升級(jí)流程](#React Native升級(jí)流程)恬口。
在昨天我對(duì)react-native-splash-screen做了React Native v0.40適配，并按照[React Native升級(jí)流程](#React Native升級(jí)流程)的步驟沼侣，將examples的React Native版本從v0.32升級(jí)到了 v0.40祖能。在這里我會(huì)結(jié)合這次升級(jí)來(lái)講解一下React Native v0.40所帶來(lái)的一些變化。
心得：升級(jí)的過(guò)程是痛苦的蛾洛，但疼并快樂(lè)著养铸。
React Native v0.40所帶來(lái)的一些重大變化
從React Native的更新文檔我們可以看到每次版本升級(jí)所帶了的一些重大變化，在v0.40版本中也是一樣轧膘。
iOS Native部分的頭文件被移動(dòng)
在 v0.40版本中钞螟，影響最為廣泛的一個(gè)變化就是這個(gè)了，iOS Native部分的頭文件被移動(dòng)到了React下谎碍。這一變化直接導(dǎo)致所有原生模塊和有引用React Native .h文件的代碼在v0.40上無(wú)法運(yùn)行鳞滨。
在v0.40之前要導(dǎo)入一個(gè)React Native .h文件的格式是這樣的：
#import "RCTUtils.h"
在v0.40版本導(dǎo)入一個(gè)React Native .h文件則變成了這個(gè)樣子：
#import <React/RCTUtils.h>
為了解決我們需要將所有引用到了React Native .h文件的代碼改成v0.40的寫法。
可參考：AppDelegate.m
心得：不僅于此蟆淀，這一變更直接導(dǎo)致所有用到React Native .h的第三方庫(kù)在沒(méi)有做上述更改之前都無(wú)法兼容v0.40
require('image!...')引用圖片方式不在支持
require('image!...')這種使用圖片的方式已經(jīng)被啟用很久了拯啦，在v0.40版本中則直接把它移除了澡匪，也就是以后我們不能再通過(guò)這種方式來(lái)使用圖片了。更多使用圖片的方式可以參考官方文檔：Images使用
心得：無(wú)論是在做React Native開(kāi)發(fā)還是在做其他開(kāi)發(fā)褒链，一些被標(biāo)記為deprecated的API唁情，要及時(shí)的替換掉，因?yàn)樵诓痪玫膶?lái)這些被棄用的API很可能從SDK中移除碱蒙。
推薦學(xué)習(xí)：視頻教程《React Native開(kāi)發(fā)跨平臺(tái)GitHub App》
最后
既然來(lái)了荠瘪，留下個(gè)喜歡再走吧，鼓勵(lì)我繼續(xù)創(chuàng)作(_)∠※
如果喜歡我的文章赛惩，那就關(guān)注我的博客@ devio.org吧，讓我們一起做朋友~~
戳這里,加關(guān)注哦:
微博：第一時(shí)間獲取推送
個(gè)人博客：干貨文章都在這里哦
GitHub：我的開(kāi)源項(xiàng)目
