在?React?Native?中給第三方庫打補丁的過程解析
有時使用了某個React Native 第三方庫，可是它有些問題，我們不得不修改它的源碼。本文介紹如何修改源碼又不會意外丟失修改結(jié)果的方法。
我們可能不方便給原作者提 Pull Request，因為他們可能不愿意接受我們的更改。又或者原作者無法及時發(fā)布新版本。
種種原因，我們只有去修改 node_modules 目錄下的文件。
可是當(dāng)我們執(zhí)行 yarn install 或 yarn add 時，原先的修改會丟失。
有沒有辦法讓我們可以在 yarn install 或 yarn add 時，自動把修改的源碼加載進(jìn)來？
patch-package 來拯救！
安裝
安裝以下兩個 package：
yarn add patch-package postinstall-postinstall
大多數(shù)時候，當(dāng)你執(zhí)行 yarn add 、 yarn remove 或 yarn install 時，Yarn 會用原始的模塊完全取代你的 node_modules 的內(nèi)容。 patch-package 使用 postinstall 鉤子按照你的要求來修改這些原始模塊。
Yarn 只在 yarn install 和 yarn add 之后運行 postinstall 鉤子，但不包括在 yarn remove 之后。postinstall-postinstall 包用來確保你的 postinstall 鉤子在 yarn remove 后也能被執(zhí)行。
配置 scripts ，確保每次執(zhí)行 yarn install 或者 yarn add 之后，都會自動執(zhí)行 patch-package ：
// package.json
"scripts": {
"postinstall": "patch-package",
}使用
首先對你的 node_modules 文件夾中的某個包的文件進(jìn)行修改，然后運行
yarn patch-package package-name
譬如，我們的項目依賴了 react-native-system-setting 這個包，但是這個包已經(jīng)不再更新了，而 React Native 的新版本要求每一個發(fā)布事件的模塊，必須實現(xiàn)以下兩個方法：
@ReactMethod
public void addListener(String eventType) {
// do nothing
}
@ReactMethod
public void removeListeners(int count) {
// do nothing
}那么我們可以修改這個包的源碼，添加這兩個方法，然后運行
yarn patch-package react-native-system-setting
可以看到，在根目錄下，創(chuàng)建了一個 patches 文件夾，里面有一個補丁文件，記錄了對 react-native-system-setting 的修改。
這樣就不怕補丁丟失了。
示例
這里有 一個示例 ，供你參考。
到此這篇關(guān)于在 React Native 中給第三方庫打補丁的過程解析的文章就介紹到這了,更多相關(guān)React Native第三方庫打補丁內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
React Native (簡稱RN)是Facebook于2015年4月開源的跨平臺移動應(yīng)用開發(fā)框架，是Facebook早先開源的JS框架 React 在原生移動應(yīng)用平臺的衍生產(chǎn)物，支持iOS和安卓兩大平臺。本文將介紹React Native與IOS端之間的交互。2021-06-06
React之如何在Suspense中優(yōu)雅地請求數(shù)據(jù)
Suspense 是 React 中的一個組件，直譯過來有懸掛的意思，能夠?qū)⑵浒漠惒浇M件掛起，直到組件加載完成后再渲染，本文詳細(xì)介紹了如何在Suspense中請求數(shù)據(jù)，感興趣的小伙伴可以參考閱讀本文2023-04-04
React實現(xiàn)父組件調(diào)用子組件的兩種寫法
react通信分很多種,比如：父子通信,兄弟通信等等,這里我們就簡單說一下父子通信,父子通信分為：父組件調(diào)用子組件里面的方法；子組件調(diào)用子組件里面的方法,這里我們著重說一下父組件調(diào)用子組件,需要的朋友可以參考下2024-04-04
詳細(xì)談?wù)凴eact中setState是一個宏任務(wù)還是微任務(wù)
學(xué)過react的人都知道,setState在react里是一個很重要的方法,使用它可以更新我們數(shù)據(jù)的狀態(tài),下面這篇文章主要給大家介紹了關(guān)于React中setState是一個宏任務(wù)還是微任務(wù)的相關(guān)資料,需要的朋友可以參考下2021-09-09
React 無狀態(tài)組件(Stateless Component) 與高階組件
這篇文章主要介紹了React 無狀態(tài)組件(Stateless Component) 與高階組件，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-08-08
這篇文章主要為大家介紹了React?實現(xiàn)具備吸頂和吸底功能組件實例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-02-02
本文主要總結(jié)了React組件的三種寫法以及最佳實踐，具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01
這篇文章主要為大家介紹了react?Scheduler?實現(xiàn)示例教程，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09
create-react-app構(gòu)建項目慢的解決方法
這篇文章主要介紹了create-react-app構(gòu)建項目慢的解決方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
ReactNative點擊事件.bind(this)操作分析
這篇文章主要為大家介紹了ReactNative點擊事件.bind(this)操作分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-11-11