Cocoapods管理React-native的三方庫

公司因需要用到React-Native開發幾個項目,在接手上一個前輩的項目的時候感到頭痛。

幾乎每一個三方庫都要以工程的形式導入,然后需要看文檔去找集成方法。當一個庫出現問題或者經常性會因為npm install某個庫的時候其他庫出現自動刪除的情況。就又要從頭開始一個個的庫去查找。有時一天兩天的有時一周時間都在處理這樣的問題。

發現了一個比較取巧的方法是:用cocoapods來管理這些第三方庫,存一份podfile文件就能一勞永宜。

先上一份目前項目中正在用到的一些RN三方庫的podfile文件:


platform :ios, '9.0'

target 'Personal' do

? pod 'yoga', path: '../node_modules/react-native/ReactCommon/yoga/'

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

? ? ? 'Core',

? ? ? 'DevSupport',

? ? ]

? pod 'RNFS', :path => '../node_modules/react-native-fs'

? pod 'react-native-amap3d', path: '../node_modules/react-native-amap3d/lib/ios/'? #地圖

? pod 'ReactNativePermissions', :path => '../node_modules/react-native-permissions' #權限管理

? pod 'RCTHttpCache', :path => '../node_modules/react-native-http-cache'? ? ? ? ? ? #數據請求

? pod 'RNPutiPay', :path => '../node_modules/react-native-puti-pay/ios'? ? ? ? ? ? #支付

? pod 'socket.io-push-oc'? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? #socket push

? pod 'UMCShare/Social/ReducedWeChat'? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? #分享? 登錄

? pod 'UMCShare/Social/ReducedQQ'? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? #分享? 登錄

? pod 'UMCShare/Social/ReducedSina'? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? #分享? 登錄

? pod 'UMCAnalytics'? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? #統計

? pod 'react-native-async-storage', :path => '../node_modules/@react-native-community/async-storage'? #異步存儲

? pod 'RNGestureHandler', :path => '../node_modules/react-native-gesture-handler'? ? ? ? #手勢

? pod 'react-native-splash-screen', :path => '../node_modules/react-native-splash-screen'#處理白屏

end

post_install do |installer|

? ? installer.pods_project.targets.each do |target|

? ? ? ? targets_to_ignore = %w(React yoga)

? ? ? ? if targets_to_ignore.include? target.name

? ? ? ? ? ? target.remove_from_project

? ? ? ? end

end

end


platform:兼容的iOS系統最低版本

target??? :工程文件名字

后面的pod就是對應的每個三方庫?? path指向podspec描述文件

再后面的post_install do |installer|是為了防止在三方庫中有一些庫對于RN的系統庫有依賴 導致在導入三方庫的時候和系統庫發生沖突導致報錯? duplicate XXXXXXXX

現在的問題是有些三方庫并沒有提供cocoapod集成的方法那么要怎么做才能使用cocoapod來集成三方庫

例如react-native-splash-screen在文檔中并沒有提供cocoapod方法??? 但是在下載該三方庫之后會發現里面有一個react-native-splash-screen.podspec文件 ? ? 那么就容易了 ?? 直接 pod 'react-native-splash-screen', :path => '../node_modules/react-native-splash-screen' ? ?? path指向這個podspec文件就行了

如果連podspec文件都不存在的庫我們該怎么處理 ?

首先我們來看一下podspec文件里面都是一些什么信息

require "json"

package = JSON.parse(File.read(File.join(__dir__, "package.json")))

Pod::Spec.new do |s|
? s.name???????? = "react-native-splash-screen"
? s.version????? = package["version"]
? s.summary????? = package["description"]
? s.author?????? = 'crazycodeboy'
? s.homepage???? = package["homepage"]
? s.license????? = package["license"]
? s.platform???? = :ios, "7.0"
? s.source?????? = { :git => "https://github.com/crazycodeboy/react-native-splash-screen", :tag => "v#{s.version}" }
? s.source_files? = "ios/*.{h,m}"
? s.dependency "React"
end

大致猜一下

s.name??? 名字

s.version??? 版本號

s.summary??? 描述

s.author ? 作者

s.homepage 主頁

s.license?? 許可證

s.platform?? 平臺

s.source? 來源

s.source_files 來源文件

s.dependency? 依賴庫

既然沒有podspec文件咱給他創建一個例如react-native-zendesk-chat

這個庫在下載之后是沒有podspec文件的??? 咱們復制一個剛才的文件到node_modules/react-native-zendesk-chat文件夾下面

然后名字改成react-native-zendesk-chat.podspec

里面該寫什么?

照葫蘆畫瓢!!

庫里面有package.json文件

照著package.json文件把信息填上


運行pod install


require 'json'

pjson = JSON.parse(File.read('package.json'))

Pod::Spec.new do |s|

? s.name??????????? = "UPPayControl"

? s.version???????? = pjson["version"]

? s.homepage??????? = "https://github.com/ws752958369/react-native-unionpay"

? s.summary???????? = pjson["description"]

? s.license???????? = pjson["license"]

? s.author????????? = { "Johannes Lumpe" => "johannes@lum.pe" }

? s.ios.deployment_target = '7.0'

? s.source????????? = { :git => "git+https://github.com/ws752958369/react-native-unionpay", :tag => "v#{s.version}" }

? s.source_files??? = '**/*.{h,m}'

? s.preserve_paths? = "**/*.js"

? s.dependency 'React'

end

看到這里基本上說明我們寫的本地podspec文件是沒有問題的

引用測試

編譯發現未報錯? 大功告成!!!

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,505評論 6 533
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,556評論 3 418
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,463評論 0 376
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,009評論 1 312
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,778評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,218評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,281評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,436評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,969評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,795評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,993評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,537評論 5 359
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,229評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,659評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,917評論 1 286
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,687評論 3 392
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,990評論 2 374

推薦閱讀更多精彩內容