問題背景
vue中使用vue-pdf打包之后預(yù)覽報(bào)錯(cuò)hash+worker.js路徑不對(duì)404
解決方式
修改node_modules依賴并安裝patch-package，將生成的補(bǔ)丁包提交到gitlab，發(fā)版時(shí)需全量發(fā)版
具體步驟
1、進(jìn)入目錄 node_modules/vue-pdf/node_modules/worker-loader/dist/index.js 找到
const filename = _loaderUtils2.default.interpolateName(this, options.name || '[hash].worker.js', {}
2、修改為
const filename = _loaderUtils2.default.interpolateName(this, options.name || 'static/js/[hash].worker.js', {}
3、安裝patch-package
npm i patch-package --save-dev
4、創(chuàng)建補(bǔ)丁
npx patch-package vue-pdf/worker-loader 運(yùn)行后會(huì)在項(xiàng)目根目錄下的patches目錄中創(chuàng)建一個(gè)名為worker-loader+2.0.0.patch的文件。將該patch文件提交后，即可在之后應(yīng)用該補(bǔ)丁了。
5、在 package.json 的 scripts 中加入
"scripts": {
"postinstall": "patch-package"
}
后續(xù)執(zhí)行 npm install 或 yarn install 命令時(shí)，會(huì)自動(dòng)為依賴包打補(bǔ)丁了
patch-package?使用指南
安裝
1、patch-package包可以通過npm進(jìn)行安裝。
npm i patch-package --save-dev
2、通過yarn進(jìn)行安裝。
yarn add --dev patch-package postinstall-postinstall
創(chuàng)建補(bǔ)丁
npx patch-package name
name表示被修改的依賴包的名稱
在修改依賴包內(nèi)容后，就可以運(yùn)行patch-package創(chuàng)建patch文件了。
運(yùn)行后通常會(huì)在項(xiàng)目根目錄下的patches目錄中創(chuàng)建一個(gè)名為package-name+version.patch的文件。將該patch文件提交至版本控制中，即可在之后應(yīng)用該補(bǔ)丁了。
[圖片上傳失敗...(image-470d5b-1631522498161)]
添加指令
在 package.json 的 scripts 中加入 "postinstall": "patch-package"，后續(xù)執(zhí)行 npm install 或 yarn install 命令時(shí)，會(huì)自動(dòng)為依賴包打補(bǔ)丁了
"scripts": {
"postinstall": "patch-package"
}</pre>
每次修改node_moudle時(shí)都需要執(zhí)行
npx patch-packagename一次，并提交到對(duì)應(yīng)分支在Jenkins發(fā)版時(shí)，為防止不能執(zhí)行新提交的補(bǔ)丁包，建議選擇全量進(jìn)行發(fā)版
要修改的依賴包版本最好是固定的，即不會(huì)自動(dòng)升級(jí)版本，這樣可以避免自動(dòng)升級(jí)后導(dǎo)致補(bǔ)丁包失效，從而打包失敗影響原有功能
引用鏈接
1、vue-pdf插件文檔
http://www.itdecent.cn/p/d126ca551e1b
