一、應用場景

最近在進行開源平臺的二開工作，有一些功能不可避免的需要改動一些依賴包的源碼，會修改node_models中的代碼。

在開發環境中，我們可以直接通過yarn gulp -> yarn start進行編譯測試，但是如果我想將代碼同步到倉庫時候則遇到了問題：一般不會將node_models文件進行同步，則別人拉下來的代碼依然是未修改的版本。

那么如何解決這個問題呢？

二、patch-package 和 postinstall

patch-package

patch-package 是一個用于修改第三方依賴包的工具，主要用途包括：

• 臨時修復依賴包中的bug：當第三方庫有bug但未及時修復時，可以直接修改源碼
• 定制化需求：對依賴包進行個性化修改以滿足特定需求
• 緊急修復：在等待官方修復期間，使用本地補丁解決問題

使用流程：

1. 安裝 patch-package 到開發依賴
2. 直接修改 node_modules 中的依賴包代碼
3. 生成補丁文件
4. 提交補丁文件到版本控制系統

postinstall

postinstall 是 npm/yarn 的生命周期鉤子腳本之一：

• 自動執行：在執行 npm install 或 yarn install 后自動運行
• 定義位置：在 package.json 的 scripts 字段中定義
• 常見用途：
  • 應用補丁（如使用 patch-package）
  • 構建原生模塊
  • 初始化項目配置
  • 執行必要的設置腳本

三、操作步驟

1、使用yarn安裝patch-package和postinstall-postinstall

命令行：

yarn add patch-package postinstall-postinstall

報錯解決：

對于工程需要明確：將依賴項添加到根還是添加到特定的工作區包：

若：將依賴項添加到根 workspace，執行：

yarn add <package-name> -W
# 或者
yarn add <package-name> --ignore-workspace-root-check

若：將依賴項添加到特定的工作區包，執行：

yarn workspace <workspace-name> add <package-name>

所以以上代碼替換為：

yarn add patch-package postinstall-postinstall -W

2、修改package.json

// package.json
"scripts": {"postinstall": "patch-package",
}

postinstall 是 npm 或 yarn 安裝依賴后自動執行的腳本，通常用于執行后續配置或修補操作。這里將其指向patch-package

3、修改node-model中源碼、保存。

4、找到修改文件對應的包名

執行以下代碼：

yarn patch-package 你的包名# 以protomaps為例
yarn patch-package protomaps

然后會在根目錄下出現：

5、使用git將新增的patches文件同步到倉庫

(新安裝包后，yarn.lock也會修改，因此同步提交)

6、新環境拉下倉庫，驗證修改是否成功。

執行yarn install的時候會自動執行patch-package，自動替換源碼補丁。修改成功

四、通過git維護自定義依賴庫

若需要二開大量修改源碼的時候，還可以單獨維護一個自定義依賴庫。這樣拉取代碼的時候可以自動獲取你修改后的依賴版本。

修改方式

在package.json中，找到devDependencies下對應的包名，將原先的版本號，替換為git+倉庫路徑：

例如，以terriajs包為例：

"devDependencies": {
"terriajs": "git+http://github.com/yourGitRepository/terriajs.git",
}

然后再次在終端輸入以下命令，安裝依賴并啟動項目，偶爾會碰到github被墻的問題（也可以使用gitea/gitlab）

yarn install 
yarn gulp
yarn start

這樣拉下來的就是更新后的版本了。