今天首次嘗試使用RN,真的是困難重重,一不小心就漂一片紅,真是心力交瘁。
首先是跟著官網這一篇教程學習的https://facebook.github.io/react-native/docs/integration-with-existing-apps.html 在現有iOS項目中添加RN,項目中只是部分頁面需要使用RN,而不是全部頁面。
按照上面一步步來流程是沒有什么問題,只是當你想把項目跑起來的時候,肯定會遇到問題,因為這篇文檔上缺少了一些步奏,下面是我按照這個教程學習RN,遇到的一些問題和解決辦法,如果你也遇到了相同的問題,希望能幫到你。
一、直接用Xcode打開ios項目run,報如下error
error : '_JSNoBytecodeFileFormatVersion", referenced from'
screenshot.png
- 解決辦法:查看此條issue https://github.com/facebook/react-native/issues/14925
pod 'React', :path => '../node_modules/react-native', :subspecs => [
'Core',
'DevSupport', # Include this to enable In-App Devmenu if RN >= 0.43
'RCTText',
'RCTNetwork',
'RCTWebSocket', # needed for debugging
'BatchedBridge', # needed as of (0.46)
# Add any other subspecs you want to use in your project
]
# Explicitly include Yoga if you are using RN >= 0.42.0
pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
看到這個podfile文件和官方文檔上的不同了嗎,對了多加了一條'BatchedBridge'
就是因為沒有引進這個文件才導致的報錯,所以添加上這個文件重新pod install
就可以了。
二、查看RN創建的RCTRootView頁面,報錯“Application RNHighScores has not been registered”
screenshot.png
并有下面的提示,小白做這個還是不太懂,明明是照著文檔寫的為什么錯了呢,查看根目錄下的index.js文件
AppRegistry.registerComponent('MyReactNativeApp', () => RNHighScores);
是注冊RNHighScores
的問題嗎?搜了一些網上的回答,說是需要AppRegistry.registerComponent('項目名稱', () => RNHighScores);
這里填寫的項目名稱
需要和RCTRootView初始化時,填寫的moduleName保持一致
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
moduleName:@"項目名稱"
initialProperties:nil
launchOptions:launchOptions];
嘗試著修改了下,能順利的跑起來了,所以如果碰到這個問題試著都換成組件名稱試試。
第一次嘗試RN,坑果然是很多,不過這是技術的趨勢,以后編寫代碼將會越來越簡單.