zyestin's blog
Posts Tags Categories About
zyestin's blog

Contents

patch-package 补丁工具使用

zyestin included in npm
   914 words   5 minutes 

patch-package 官方地址 https://www.npmjs.com/package/patch-package

首次安装 失败&&解决

package.json内scripts下 添加

1

"postinstall": "patch-package"

安装，失败

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

npm i patch-package                                                                                                                          10:18:05
npm ERR! code ECONNREFUSED
npm ERR! errno ECONNREFUSED
npm ERR! FetchError: request to https://mirrors.huaweicloud.com/repository/npm/patch-package failed, reason: connect ECONNREFUSED 127.0.0.1:1087
npm ERR!     at ClientRequest.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/node-fetch-npm/src/index.js:68:14)
npm ERR!     at ClientRequest.emit (events.js:400:28)
npm ERR!     at onerror (/usr/local/lib/node_modules/npm/node_modules/agent-base/index.js:101:9)
npm ERR!     at callbackError (/usr/local/lib/node_modules/npm/node_modules/agent-base/index.js:123:5)
npm ERR!     at processTicksAndRejections (internal/process/task_queues.js:95:5)
npm ERR!  FetchError: request to https://mirrors.huaweicloud.com/repository/npm/patch-package failed, reason: connect ECONNREFUSED 127.0.0.1:1087
npm ERR!     at ClientRequest.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/node-fetch-npm/src/index.js:68:14)
npm ERR!     at ClientRequest.emit (events.js:400:28)
npm ERR!     at onerror (/usr/local/lib/node_modules/npm/node_modules/agent-base/index.js:101:9)
npm ERR!     at callbackError (/usr/local/lib/node_modules/npm/node_modules/agent-base/index.js:123:5)
npm ERR!     at processTicksAndRejections (internal/process/task_queues.js:95:5) {
npm ERR!   type: 'system',
npm ERR!   errno: 'ECONNREFUSED',
npm ERR!   code: 'ECONNREFUSED'
npm ERR! }
npm ERR! 
npm ERR! If you are behind a proxy, please make sure that the
npm ERR! 'proxy' config is set properly.  See: 'npm help config'

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/yestin/.npm/_logs/2022-07-14T02_30_35_701Z-debug.log

搜

https://segmentfault.com/a/1190000023314583

solution:

1
2

# 配置指向源
$ npm config set registry http://registry.npm.taobao.org

配置前

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

~/workspace/ihuaben-app dev_zy_i *2 !1 > npm config list                                                                                                                    1m 12s 10:34:40
; cli configs
metrics-registry = "https://mirrors.huaweicloud.com/repository/npm/"
scope = ""
user-agent = "npm/6.14.15 node/v14.18.3 darwin x64"

; userconfig /Users/yestin/.npmrc
home = "https://npm.taobao.org"
registry = "https://mirrors.huaweicloud.com/repository/npm/"

; node bin location = /usr/local/bin/node
; cwd = /Users/yestin/workspace/ihuaben-app
; HOME = /Users/yestin
; "npm config ls -l" to show all defaults.

配置后

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

 npm config list                                                                                                                           10:39:05
; cli configs
metrics-registry = "http://registry.npm.taobao.org/"
scope = ""
user-agent = "npm/6.14.15 node/v14.18.3 darwin x64"

; userconfig /Users/yestin/.npmrc
home = "https://npm.taobao.org"
registry = "http://registry.npm.taobao.org/"

; node bin location = /usr/local/bin/node
; cwd = /Users/yestin/workspace/ihuaben-app
; HOME = /Users/yestin
; "npm config ls -l" to show all defaults.

然后 安装成功

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

npm i patch-package                                                                                                                       10:39:10
npm WARN @babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.14.5 requires a peer of @babel/core@^7.13.0 but none is installed. You must install peer dependencies yourself.
npm WARN @babel/plugin-proposal-class-static-block@7.14.5 requires a peer of @babel/core@^7.12.0 but none is installed. You must install peer dependencies yourself.
npm WARN @react-native-community/cameraroll@1.2.1 requires a peer of react-native@>=0.57 <=0.59 but none is installed. You must install peer dependencies yourself.
...

+ patch-package@6.4.7
added 12 packages from 23 contributors and removed 153 packages in 40.037s

52 packages are looking for funding
  run `npm fund` for details

yarn

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

yarn add patch-package postinstall-postinstall                                                                                        41s 10:40:04
yarn add v1.22.19
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] 🔍  Resolving packages...
info There appears to be trouble with your network connection. Retrying...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning "hox > react-reconciler@0.25.1" has incorrect peer dependency "react@^16.13.1".
warning " > mobx-react@5.3.5" has unmet peer dependency "mobx@^4.0.0 || ^5.0.0".
warning " > react-native-elements@3.4.2" has unmet peer dependency "react-native-safe-area-context@^3.1.9".
warning " > react-native-elements@3.4.2" has incorrect peer dependency "react-native-vector-icons@>7.0.0".
warning " > react-native-fs@2.18.0" has unmet peer dependency "react-native-windows@*".
warning " > react-native-head-tab-view@2.1.7" has incorrect peer dependency "@react-native-community/viewpager@^3.3.0".
warning " > react-native-iap@6.2.1" has incorrect peer dependency "react@>=16.13.1".
warning "react-native-router-flux > react-navigation-stack@1.10.3" has incorrect peer dependency "react-native-screens@^1.0.0 || ^1.0.0-alpha".
warning " > react-native-selfadapt-modal@1.1.3" has incorrect peer dependency "react-native@^0.41.2".
warning "@react-native-community/eslint-config > @typescript-eslint/eslint-plugin@1.13.0" has incorrect peer dependency "eslint@^5.0.0".
warning "@react-native-community/eslint-config > @typescript-eslint/parser@1.13.0" has incorrect peer dependency "eslint@^5.0.0".
warning "@react-native-community/eslint-config > eslint-plugin-react@7.12.4" has incorrect peer dependency "eslint@^3.0.0 || ^4.0.0 || ^5.0.0".
warning "@react-native-community/eslint-config > eslint-plugin-react-native@3.6.0" has incorrect peer dependency "eslint@^3.17.0 || ^4 || ^5".
[4/4] 🔨  Building fresh packages...
success Saved lockfile.
success Saved 10 new dependencies.
info Direct dependencies
├─ patch-package@6.4.7
├─ postinstall-postinstall@2.1.0
├─ react-native-gesture-handler@1.10.3
└─ react-native-head-tab-view@2.1.7
info All dependencies
├─ @yarnpkg/lockfile@1.1.0
├─ cross-fetch@3.1.5
├─ find-yarn-workspace-root@2.0.0
├─ klaw-sync@6.0.0
├─ patch-package@6.4.7
├─ picomatch@2.3.1
├─ postinstall-postinstall@2.1.0
├─ react-native-gesture-handler@1.10.3
├─ react-native-head-tab-view@2.1.7
└─ whatwg-url@5.0.0
$ patch-package
patch-package 6.4.7
Applying patches...
No patch files found
✨  Done in 93.67s.

优势

一人 操作下面3步，其它人完全无感知，npm i时 自动完成补丁的应用

1
2
3
4

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

1

npm i patch-package

1

npx patch-package libxx

遇到过的bug

执行npm i，react-native-image-crop-picker+0.38.0.patch apply会失败

  • 方法1 删三方库重新安装（较快）
1

rm -rf node_modules/react-native-image-crop-picker && npm i
  • 方法2

于是照着react-native-image-crop-picker+0.38.0.patch改文件里的源码，再次执行

1

npx patch-package react-native-image-crop-picker --include 'PickerModule.java'

发现react-native-image-crop-picker+0.38.0.patch什么也没改 然后执行npm i就成功了

后来发现原因，如下，.patch文件中，会出现好多行 带有绝对路径/Users/...的文件路径

1
2
3

-#Wed Jun 29 16:49:45 CST 2022
-/Users/lsye/ihuaben-app/node_modules/react-native-picker/android/src/main/res/layout/picker_view_linkage.xml=/Users/lsye/ihuaben-app/node_modules/react-native-picker/android/build/intermediates/packaged_res/debug/layout/picker_view_linkage.xml
...

可能是同事执行时，出现异常情况了

执行npx patch-package react-native-xx, .patch会出现许多多余的文件字符串

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

...
index 408362c..5fd7d55 100644
Binary files a/node_modules/react-native-picker/android/build/intermediates/runtime_library_classes/release/classes.jar and b/node_modules/react-native-picker/android/build/intermediates/runtime_library_classes/release/classes.jar differ
diff --git a/node_modules/react-native-picker/android/src/main/java/com/beefe/picker/.DS_Store b/node_modules/react-native-picker/android/src/main/java/com/beefe/picker/.DS_Store
new file mode 100644
index 0000000..7a08108
Binary files /dev/null and b/node_modules/react-native-picker/android/src/main/java/com/beefe/picker/.DS_Store differ
diff --git a/node_modules/react-native-picker/android/src/main/java/com/beefe/picker/view/OnItemSelectedRunnable.java b/node_modules/react-native-picker/android/src/main/java/com/beefe/picker/view/OnItemSelectedRunnable.java
index c52b1a7..7990d96 100644
--- a/node_modules/react-native-picker/android/src/main/java/com/beefe/picker/view/OnItemSelectedRunnable.java
+++ b/node_modules/react-native-picker/android/src/main/java/com/beefe/picker/view/OnItemSelectedRunnable.java
@@ -10,6 +10,10 @@ final class OnItemSelectedRunnable implements Runnable {
 
     @Override
     public final void run() {
-        loopView.onItemSelectedListener.onItemSelected(loopView.getSelectedItem(),loopView.getSelectedIndex());
+        try {
+            loopView.onItemSelectedListener.onItemSelected(loopView.getSelectedItem(), loopView.getSelectedIndex());
+        } catch (Exception e) {
+            e.printStackTrace();
+        }
     }
 }

原因是 安卓build之后的产物，在执行npx patch-package ...时 被莫名其妙带进去了

解决方案

  • 方法1
    可以把改后的文件拷贝出来，将三方库删了重装，再覆盖 拷贝的文件，再执行npx patch-package ...

  • 方法2
    使用绝对路径

    1

    npx patch-package react-native-xx --include 'file1|file2'
Updated on 2024-04-10  545c762
Read Markdown
 tool, npm
Back | Home