最近遇到一個yarn的bug，搜尋之後發現它竟然存在6年之久，這到底是個怎樣神奇的問題？經過一番分析排查，我給了6個解決方案。 。 。
1、問題描述
最近接手的幾個專案套件管理器用的是yarn@v1.22.19，在安裝依賴後無論是否成功，總是出現網路連線問題而且會卡很長時間，然後會出現幾行這樣的異常日誌：info There appears to be trouble with your network connection. Retrying...。 
有時一些神奇的套件(例如 node-sass)出現異常會導致安裝失敗，結果卡了半天才發現失敗，真的讓人很崩潰。另外在yarn 的 github 倉庫中有數十條相關的 issue，時間跨度從2016年到2022年足足6年，原因和方案眾說紛紜。我很好奇這到底是個什麼神奇的問題居然6年都沒解決，因此決定一探究竟。 【相關教學推薦：nodejs影片教學 、程式設計影片】
2、問題排查
2.1、關鍵字搜尋
2.1.1、搜尋github
yarn 的github 倉庫中搜尋報錯訊息There appears to be trouble with your network connection，可以看到結果中有1個相關程式碼和91個相關issue。在 
issue
裡找了一會兒沒找到合適的方案，接著進入下一步：搜尋程式碼。
2.1.2、搜尋程式碼
yarn 的安裝目錄進行尋找。用vscode 開啟yarn 的安裝目錄（我的本機目錄是~/.volta/tools/image/yarn/1.22.19），全域搜尋關鍵字There appears to be trouble with your network connection。可以看到結果同樣只有1個，整串錯誤訊息賦值給了一個變數
offlineRetrying
。
offlineRetrying 共2處結果，除去上一步驟的結果只有1處引用。這裡的程式碼主要是拋出異常和重試，沒有更多關鍵字可以挖掘。接下來進入調試環節，在 
offlineRetrying
這行程式碼前面打個斷點，調試看看具體錯誤訊息和上下文。
2.2、程式偵錯
2.2.1、確定偵錯指令
yarn， 那要怎麼除錯它呢？ yarn 是一個npm 套件，執行時實際上是呼叫node xxx.js，而這個xxx.js 一般配置在package.json 的bin 欄位中。從下圖可以看到yarn 對應的檔案是./bin/yarn.js，所以可以用這行偵錯指令：node --inspect-brk ~/ .volta/tools/image/yarn/1.22.19/bin/yarn.js。 （關於Node.js 的調試可以參考
官方文件
）
2.2.2、開始調試
offlineRetrying 所在的程式碼行cli.js:66099之前加入
debugger
語句。 ######
然後回到業務專案的根目錄中，執行偵錯指令 node --inspect-brk ~/.volta/tools/image/yarn/1.22.19/bin/yarn.js。此時程式掛起等待偵錯工具連接，並列印以下日誌：
接著開啟chrome 內建的偵錯頁面chrome://inspect/#devices，找到檔案路徑相同的Target，點選inspect按鈕開始偵錯。
接著chrome 會開啟一個獨立的DevTools 窗口，由於使用的是node --inspect-brk 指令，此時DevTools 自動斷點在被偵錯檔案的起始位置，需要按下F8 跳過該斷點繼續執行。 
等待一小段時間後，DevTools 停在先前新增的斷點處，可以看到這是一個逾時異常，導致異常的請求是GET: https://yarnpkg.com/latest-version。使用 curl 請求這個鏈接，結果是 210s 逾時。使用代理程式存取這個連結可以成功，但是請求被重定向到 classic.yarnpkg.com/latest-vers…，其回傳結果是 1.22.19。 
至此問題基本上清楚了，主要是請求超時並且多次重試導致了文章開頭的問題，可以使用代理規避這個問題。如果排查到此結束就沒意思了。
2.2.3、深入檢查
為了進一步了解yarn 為什麼要請求yarnpkg.com/latest-vers…，以此連結為關鍵字在程式碼中搜索，找到了這個關鍵字鏈：https://yarnpkg.com/latest-version -> SELF_UPDATE_VERSION_URL -> _checkUpdate -> checkUpdate，實際呼叫關係則剛好相反，具體如下圖：
##3、確定原因
前面已經推斷出逾時連結的呼叫關係是：
checkUpdate -> _checkUpdate -> SELF_UPDATE_VERSION_URL -> https://yarnpkg.com/latest-version，再結合checkUpdate函數的註解和程式碼來看，每次執行yarn 安裝指令的時候都會要求yarnpkg.com/latest-vers…，從而檢查是否有新版本需要更新。但這個連結存取逾時而且失敗後會重試，預設的超時時間為 30s 重試次數為 4 次，所以安裝完成後還會卡 120s 程式才會真正結束。
4、解決方案
引發問題的關鍵因素有3個：檢查更新、逾時、重試，因此可以從優化網路、調整超時時間、跳過檢查更新3個方向去解決問題，以下有6個解決方案可以參考。
4.1、優化網路
這個想法很容易想到，既然存取逾時，那就提升請求速度。
【方案1】使用代理程式最佳化網路（建議）$ yarn install --proxy "http://{domain}:{port}" --https-proxy "http://{domain}:{port}"登入後複製
#以我的開發環境舉例，指令長這樣：
yarn install --proxy "http://10.180.55.191:7890" --https-proxy "http://10.180.55.191:7890"
登入後複製
4.2、調整超時時間
這個想法比較直接，適用場景更多些，如果其他方法不奏效可以試試。
【方案2】修改network-timeout（看情況）
#預設逾時時間為30s 可以改小為2s，修改後異常依然存在，但可以讓檢查更新快速失敗不用等幾分鐘。
yarn install --network-timeout 2000
登入後複製
有一部分開發者表示出現異常是因為某些大型npm 套件安裝太久超過了預設逾時時間30s，因此也可以把network-timeout 改得更大避免異常。
4.3、跳過檢查更新
這個想法的解決方案主要來自
checkUpdate 函數中的幾個終止條件。
$ yarn config set disable-self-update-check true$ yarn install
登入後複製
- 【方案4】修改配置把上次更新时间调到百年后（推荐）
$ yarn config set lastUpdateCheck 1e13
$ yarn install
登入後複製
$ yarn install --non-interactive
登入後複製
- 【方案6】修改代码跳过检查更新（不推荐）
- 找到
yarn 的安装目录注释 checkUpdate 的调用，具体代码行为 cli.js:7261，修改后长这样：// this.checkUpdate();
- 也可以修改其他可以阻断
checkUpdate 函数的代码...
5、最后
以上主要是分享一些问题分析排查的经验，另外也提供了一些 yarn install 超时异常的解决方案，希望能对前端同学们有所帮助。
在快写完这篇文章的时候，yarnpkg.com/latest-vers… 已经可以正常访问，不知道还会不会有人再遇到这个问题。
另外我在 yarn 的 github issue 中回复了以上的解决方案，希望前端同学们少受点折磨，也希望官方早点修复这个6年陈的老Bug。?
更多编程相关知识，请访问：编程教学！！
以上是記錄並分析分析一個yarn存在6年之久的bug的詳細內容。更多資訊請關注PHP中文網其他相關文章！
