在?React?Native?中給第三方庫打補(bǔ)丁的過程解析
有時(shí)使用了某個(gè)React Native 第三方庫,可是它有些問題,我們不得不修改它的源碼。本文介紹如何修改源碼又不會(huì)意外丟失修改結(jié)果的方法。
我們可能不方便給原作者提 Pull Request,因?yàn)樗麄兛赡懿辉敢饨邮芪覀兊母摹S只蛘咴髡邿o法及時(shí)發(fā)布新版本。
種種原因,我們只有去修改 node_modules 目錄下的文件。
可是當(dāng)我們執(zhí)行 yarn install
或 yarn add
時(shí),原先的修改會(huì)丟失。
有沒有辦法讓我們可以在 yarn install
或 yarn add
時(shí),自動(dòng)把修改的源碼加載進(jìn)來?
patch-package 來拯救!
安裝
安裝以下兩個(gè) package:
yarn add patch-package postinstall-postinstall
大多數(shù)時(shí)候,當(dāng)你執(zhí)行 yarn add
、 yarn remove
或 yarn install
時(shí),Yarn 會(huì)用原始的模塊完全取代你的 node_modules 的內(nèi)容。 patch-package 使用 postinstall
鉤子按照你的要求來修改這些原始模塊。
Yarn 只在 yarn install
和 yarn add
之后運(yùn)行 postinstall
鉤子,但不包括在 yarn remove
之后。postinstall-postinstall 包用來確保你的 postinstall
鉤子在 yarn remove
后也能被執(zhí)行。
配置 scripts
,確保每次執(zhí)行 yarn install
或者 yarn add
之后,都會(huì)自動(dòng)執(zhí)行 patch-package
:
// package.json "scripts": { "postinstall": "patch-package", }
使用
首先對(duì)你的 node_modules 文件夾中的某個(gè)包的文件進(jìn)行修改,然后運(yùn)行
yarn patch-package package-name
譬如,我們的項(xiàng)目依賴了 react-native-system-setting 這個(gè)包,但是這個(gè)包已經(jīng)不再更新了,而 React Native 的新版本要求每一個(gè)發(fā)布事件的模塊,必須實(shí)現(xiàn)以下兩個(gè)方法:
@ReactMethod public void addListener(String eventType) { // do nothing } @ReactMethod public void removeListeners(int count) { // do nothing }
那么我們可以修改這個(gè)包的源碼,添加這兩個(gè)方法,然后運(yùn)行
yarn patch-package react-native-system-setting
可以看到,在根目錄下,創(chuàng)建了一個(gè) patches 文件夾,里面有一個(gè)補(bǔ)丁文件,記錄了對(duì) react-native-system-setting 的修改。
這樣就不怕補(bǔ)丁丟失了。
示例
這里有 一個(gè)示例 ,供你參考。
到此這篇關(guān)于在 React Native 中給第三方庫打補(bǔ)丁的過程解析的文章就介紹到這了,更多相關(guān)React Native第三方庫打補(bǔ)丁內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
react.js使用webpack搭配環(huán)境的入門教程
本文主要介紹了react 使用webpack搭配環(huán)境的入門教程,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下。2017-08-08ES6 class類鏈?zhǔn)嚼^承,實(shí)例化及react super(props)原理詳解
這篇文章主要介紹了ES6 class類鏈?zhǔn)嚼^承,實(shí)例化及react super(props)原理,結(jié)合實(shí)例形式詳細(xì)分析了ES6 中class類鏈?zhǔn)嚼^承,實(shí)例化及react super(props)原理相關(guān)概念、原理、定義與使用技巧,需要的朋友可以參考下2020-02-02react項(xiàng)目?jī)?yōu)化配置的操作詳解
這篇文章主要介紹了react項(xiàng)目?jī)?yōu)化配置,主要包括優(yōu)化配置CDN,優(yōu)化路由懶加載,結(jié)合示例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-06-06原生實(shí)現(xiàn)一個(gè)react-redux的代碼示例
這篇文章主要介紹了原生實(shí)現(xiàn)一個(gè)react-redux的代碼示例,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-06-06