RN入門:RN第一個demo


 

1.RN環境安裝。

這個參考RN入門(一)的博客就好,網上資料也很多。

創建工程:

react native  環境搭配好后  

創建項目

1.react-native init TestProject 

cmd一大堆下載創建啊之類的,等ok就好

 

然后 可以試試在cmd里 cd 到  TestProject 目錄下 

執行 npm install指令 加載rn資源

完成后執行react-native run-ios  指令

我遇到報錯信息xcrun: error: unable to find utility "instruments", not a developer tool or in PATH

 

解決方法:在 終端執行如下命令 sudo xcode-select -s /Applications/Xcode.app/Contents/Developer/

注意:前提是你已經安裝了xcode

~~!不解決這個問題的話  之后cocoaspod 在podfile文件   pod 'GLog'會報錯(一臉懵逼~~!)

pod 'GLog', :podspec => '../node_modules/react-native/third-party-podspecs/GLog.podspec'  

 好了  解決上面問題 react-native run-ios  就可以正常跑起來了~~!當然什么locahost:8081什么的配置端口這些我沒去研究 

也可以直接去iOS目錄下 運行iOS工程  也能正常啟動

 

2.創建好后,TestProject文件夾里有ios工程了  然后配置cocoaspod管理庫

cocoaspod管理第三方庫

在Podfile文件里 寫入:

pod 'React', :path => '../node_modules/react-native', :subspecs => [

'Core',

'CxxBridge', # 如果RN版本 >= 0.45則加入此行

'DevSupport', # 如果RN版本 >= 0.43,則需要加入此行才能開啟開發者菜單

'RCTText',

'RCTNetwork',

'RCTWebSocket', # 這個模塊是用於調試功能的

'ART',

'RCTActionSheet',

'RCTGeolocation',

'RCTImage',

'RCTPushNotification',

'RCTSettings',

'RCTVibration',

'RCTLinkingIOS',

'DevSupport',

'BatchedBridge',

'RCTAnimation',

# 在這里繼續添加你所需要的RN模塊

]

pod "yoga", :path => "../node_modules/react-native/ReactCommon/yoga"

 

導入yoga 開發庫   運行iOS工程會報錯    Implicit conversion loses integer precision: 'size_type' (aka 'unsigned long 之類的問題   

解決:在podfile文件里加入第三方庫警告忽略  # 忽略cocoapods里的警告

inhibit_all_warnings!

pod "yoga", :path => "../node_modules/react-native/ReactCommon/yoga"

 

然后可以正常運行iOS工程了  ~~!app運行后 就是一個welcome 的頁面

 

3.打開webstorm 或者  vscode

一開始是用webstorm  ~~!點擊了index.js后 發現有提示說 

closure linter 找不到文件之類的問題  ~~! 其實就是一些插件配置沒有配合,身為rn新手,老實折騰了一番

 

總之我后來選擇了vscode作為開發工具

也一樣提示需要 eslint  插件資源

 

找了下資料 解決方案:

執行  npm i -g eslint

然后到 TestProject 目錄下

eslint --init

這個自己動手試驗了

實際上 eslint --init  按需加載就好  不是必須要執行

 

 

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM