React-Native 十：版本升級

標籤：

更新版本的React Native將會讓你訪問更多的APIs， 這樣我們可以去使用更多的APIs,視圖Views，以及開發人員工具以及其他一些好用的東西。瀏覽版本更新日誌就會發現整體FB官方開發進度還是非常緊張的，這樣就很容易導致舊版本會出現不能用的情況，後期可能會出現不可預料的情況，這邊建議大家盡量更新最新正式版本。我們大家都知道一個React Native項目使用Android項目,iOS項目和JavaScript項目三部分進行組成的，而且三者都關聯打包在npm包內的，所以該項目版本進行更新是比較繁瑣的。下面我來給大家講解一下React Native項目的升級步驟。 一、查看目前的版本

[email protected]:~/AwesomeProject$ react-native --versionreact-native-cli: 0.2.0react-native: 0.22.2

二、查看最新的版本

[email protected]:~/AwesomeProject$ npm info react-native{ name: ‘react-native‘,  ‘dist-tags‘: { latest: ‘0.25.1‘, next: ‘0.26.0-rc‘ },  versions:   [ ‘0.0.0‘,     ‘0.0.5‘,      ... ...      ‘0.24.1‘,     ‘0.25.0-rc‘,     ‘0.25.1‘,     ‘0.26.0-rc‘ ],  maintainers:  ... ...   dist:   { shasum: ‘4177e70e56281cec8fb5fe76218bf6606eeb34b8‘,     tarball: ‘https://registry.npmjs.org/react-native/-/react-native-0.25.1.tgz‘ },  directories: {} }

三、升級依賴的版本

[email protected]:~/AwesomeProject$ npm install --save [email protected]> [email protected] install /home/pengchengxiang/AwesomeProject/node_modules/react-native/node_modules/ws/node_modules/bufferutil> node-gyp rebuildmake: Entering directory `/home/pengchengxiang/AwesomeProject/node_modules/react-native/node_modules/ws/node_modules/bufferutil/build‘  CXX(target) Release/obj.target/bufferutil/src/bufferutil.o  SOLINK_MODULE(target) Release/obj.target/bufferutil.node  COPY Release/bufferutil.nodemake: Leaving directory `/home/pengchengxiang/AwesomeProject/node_modules/react-native/node_modules/ws/node_modules/bufferutil/build‘> [email protected] install /home/pengchengxiang/AwesomeProject/node_modules/react-native/node_modules/ws/node_modules/utf-8-validate> node-gyp rebuildmake: Entering directory `/home/pengchengxiang/AwesomeProject/node_modules/react-native/node_modules/ws/node_modules/utf-8-validate/build‘  CXX(target) Release/obj.target/validation/src/validation.o  SOLINK_MODULE(target) Release/obj.target/validation.node  COPY Release/validation.nodemake: Leaving directory `/home/pengchengxiang/AwesomeProject/node_modules/react-native/node_modules/ws/node_modules/utf-8-validate/build‘> [email protected] postinstall /home/pengchengxiang/AwesomeProject/node_modules/react-native/node_modules/yeoman-generator/node_modules/cross-spawn/node_modules/spawn-sync> node postinstallnpm WARN optional dep failed, continuing [email protected][email protected] node_modules/react-native├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected]├── [email protected] ([email protected])├── [email protected] ([email protected])├── [email protected] ([email protected])├── [email protected] ([email protected])├── [email protected] ([email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected])├── [email protected] ([email protected])├── [email protected]├── [email protected] ([email protected], [email protected])├── [email protected] ([email protected], [email protected])├── [email protected] ([email protected])├── [email protected] ([email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected], [email protected])├── [email protected]├── [email protected] ([email protected], [email protected], [email protected], [email protected])├── [email protected]├── [email protected] ([email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected])├── [email protected]8.0 ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected])├── [email protected]├── [email protected] ([email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected])├── [email protected]├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])├── [email protected] ([email protected], [email protected])├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])└── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])

提示1：如果在安裝的過程中，報錯如下[email protected]:~/ReactNativeWorkspace/AwesomeProject$ npm install --save [email protected]npm ERR! tar.unpack error reading /home/pengcx/.npm/babel-runtime/6.6.1/package.tgznpm ERR! tar.unpack error reading /home/pengcx/.npm/babel-runtime/6.6.1/package.tgznpm ERR! tar.unpack error reading /home/pengcx/.npm/object-assign/4.1.0/package.tgznpm WARN optional dep failed, continuing [email protected]npm ERR! tar.unpack error reading /home/pengcx/.npm/babel-runtime/6.6.1/package.tgznpm ERR! tar.unpack error reading /home/pengcx/.npm/path-exists/1.0.0/package.tgznpm WARN optional dep failed, continuing [email protected]npm ERR! Linux 3.13.0-85-genericnpm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "install" "--save" "[email protected]"npm ERR! node v4.4.3npm ERR! npm  v2.15.1npm ERR! 0-byte tarballnpm ERR! Please run `npm cache clean`npm ERR!npm ERR! If you need help, you may report this error at:npm ERR!     <https://github.com/npm/npm/issues>npm ERR! Please include the following file with any support request:npm ERR!     /home/pengcx/ReactNativeWorkspace/AwesomeProject/npm-debug.log 處理：npm cache clean 四、更新你項目的template檔案新的npm包會包含更新在運行react-nativeinit命令產生的一些動態檔案，例如init建立項目的時候會產生iOS和Android的子項目，我們可以通過以下的命令進行擷取最新的代碼：

[email protected]:~/AwesomeProject$ react-native upgradeUpgrading project to react-native v0.25.1Be sure to read the release notes and breaking changes:https://github.com/facebook/react-native/releases/tag/v0.25.0 conflict .gitignore? Overwrite .gitignore? overwrite    force .gitignoreidentical .watchmanconfig   create .buckconfigidentical ios/AwesomeProject/AppDelegate.hidentical ios/AwesomeProject/AppDelegate.midentical ios/AwesomeProject/Base.lproj/LaunchScreen.xibidentical ios/AwesomeProject/Images.xcassets/AppIcon.appiconset/Contents.jsonidentical ios/AwesomeProject/Info.plistidentical ios/AwesomeProject/main.m conflict ios/AwesomeProjectTests/AwesomeProjectTests.m? Overwrite ios/AwesomeProjectTests/AwesomeProjectTests.m? overwrite    force ios/AwesomeProjectTests/AwesomeProjectTests.midentical ios/AwesomeProjectTests/Info.plistidentical ios/AwesomeProject.xcodeproj/project.pbxprojidentical ios/AwesomeProject.xcodeproj/xcshareddata/xcschemes/AwesomeProject.xcscheme conflict android/build.gradle? Overwrite android/build.gradle? overwrite    force android/build.gradleidentical android/gradle.propertiesidentical android/settings.gradle   create android/app/BUCK conflict android/app/build.gradle? Overwrite android/app/build.gradle? overwrite    force android/app/build.gradle conflict android/app/proguard-rules.pro? Overwrite android/app/proguard-rules.pro? overwrite    force android/app/proguard-rules.proidentical android/app/src/main/java/com/awesomeproject/MainActivity.javaTo run your app on iOS:   cd /home/pengchengxiang/AwesomeProject   react-native run-ios   - or -   Open /home/pengchengxiang/AwesomeProject/ios/AwesomeProject.xcodeproj in Xcode   Hit the Run buttonTo run your app on Android:   Have an Android emulator running (quickest way to get started), or a device connected   cd /home/pengchengxiang/AwesomeProject   react-native run-android

它會檢查你的檔案，對比最新版本，然後進行如下幾個操作:     如果是新添加的檔案，會進行直接建立     如果更新的檔案和當前項目的檔案是一樣的，就會直接忽略跳過     如果更新的檔案和當前項目的檔案不同，有衝突的情況，會讓我們進行選擇是保留原來的檔案還是用更新的檔案覆蓋，這個要看實際情況了。

React-Native 十：版本升級