開發過程中遇到一個問題,記錄一下
本地打包發布正常,發測試環境正常,可是通過Jenkins打包發布線上報錯
報錯信息
index-67fbbd81.js:39 Error: Minified React error #130; visit https://reactjs.org/docs/error-decoder.html?invariant=130&args[]=undefined&args[]= for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
打開報錯信息發現報錯
由于這次更新內容比較多,開始懷疑是不是本地代碼問題,
組件undefined一般是引入導出組件名問題。讓cursor檢查了一遍代碼,發現代碼沒有問題。
又從git上重新拉取代碼,下載依賴,運行,也是沒問題。
本地生產環境沒問題,線上報錯,說明問題很可能出在環境差異上。
對比了一下Jenkins上的node版本,react版本等,發現版本號一致。
猜想可能是使用本地包的問題,在服務器上單獨下載了依賴,導致線上本地依賴包不一致。
原本的Jenkins打包命令
yarn install
yarn build
yarn install 不是嚴格模式,可能會根據 semver 自動升級依賴,導致和本地 node_modules 不一致。
如果 Jenkins 的 node_modules 目錄有殘留,可能會混入舊依賴,導致打包產物和本地不一樣。
更改后的Jenkins命令
rm -rf node_modules
yarn cache clean
yarn install --frozen-lockfile
yarn build
rm -rf node_modules:徹底清理依賴,避免殘留
yarn cache clean:清理 yarn 緩存
yarn install --frozen-lockfile:嚴格按照 yarn.lock 安裝依賴,保證和本地一模一樣
yarn build:正常打包
這樣可以100% 保證 Jenkins 構建出來的依賴和本地完全一致,不會因為依賴包差異導致線上 undefined 或 React #130 錯誤。
很多線上“本地沒問題,線上報錯”的根因,都是因為 CI/CD 沒有嚴格依賴鎖定
接下來重新用用Jenkins打包----正常-----線上-----正常!
完美解決!