如果要起一個 JavaScript 的專案，通常會遇到需要安裝一些 dependencies 的狀況。這個看似非常稀鬆平常的工作，其實潛藏著許多值得注意的狀況。
狀況一：假設專案的協作人員不只有自己的話，也許會遇到別人也幫專案安裝 dependencies，而自己沒注意到到底新裝了哪些，久而久之可能會有冗余的 dependencies 的問題。
狀況二：dependencies 安裝已一陣時間，可能會有安全性的疑慮。
狀況三：dependencies 安裝已一段時間，沒有定期更新，導致有 breaking change 產生。
以下針對這三種常見狀況提出平常可以建立的好習慣：
📌 掌握專案的 dependencies
就像我們需要健康檢查一樣，專案建議能夠定期安排一次為 dependencies 做檢查，翻出 package.json 來看看。
Step 1.建議掌握的要點
- 各自是裝來達成什麼樣的目的？
- 真的需要嗎？會不會其實也可以自己簡單的實作出來？
- 確認裝在正確的位置
以 Npm 及 Yarn 官方的定義：
如果是在 production 環境也會用到的 dependency，建議放在 dependencies，如果是在開發、測試環境下才會用到，就可以放在 devDependencies。
Step 2.確認後刪除冗余 dependencies
Yarn 使用者
$ yarn remove your-dependency
Npm 使用者
$ npm uninstall your-dependency
📌 關注專案的 dependencies 的資安疑慮
通常隔一段時間都會更新，常見的更新原因包括有 known vulnerabilities 的出現。
👉 掃一遍專案的 dependencies，並列出細節，但不去解決問題
Yarn 使用者
$ yarn audit
Npm 使用者
$ npm audit
👉 掃一遍專案的 dependencies，並安裝已有的對應版本，解決問題
Yarn 使用者
本身沒有內建此功能，不過有一個小工具 yarn-audit-fix 可以拿來達成此功能。
Npm 使用者
$ npm audit fix
👉 使用 GitHub 內建的 dependabot vulnerabilities alerts
如何開啟
Settings > Code security and analysis > Dependabot alerts > Enable
偵測到有 vulnerabilities 時，也會寄信通知
📌 定期關注在使用的 dependencies 版本是否變動
這項非常重要，通常 dependencies 升級的原因不外乎是增加新功能、解 bug，或是剛剛提過的資安疑慮。
Step 1. 檢查已安裝的 dependencies 是否有更新的版本了，有的話列出來
Npm 使用者
$ npm outdated
內容為以下：
1 | Package Current Wanted Latest Location Depended by |
Yarn 使用者
$ yarn outdated
內容為以下：
1 | Package Current Wanted Latest Package Type URL |
Step 2.選定要更新的 dependency 做更新
事前作業
參考 dependency 的 CHANGELOG (例如：React’s CHANGELOG) 或是 Release Note (例如：React’s Release Note) 來為因升級而產生的變動做準備
👉 狀況ㄧ：更新到 package.json 鎖定好的版號範圍
Npm 使用者
$ npm update
Yarn 使用者
$ yarn upgrade
👉 狀況二：更新到不在 package.json 定義好的版號範圍
Npm 使用者
因為 Npm 沒有內建達到此需求的工具，建議安裝 npm-check。$ npm-check -u (-u 表示可以以互動介面的方式來讓使用者來選擇要進行的更新)
(取自 npm-check)
Yarn 使用者
與 Npm 相反，Yarn 有內建的互動式工具來讓使用者選擇要進行的更新
$ yarn upgrade-interactive --latest
(取自 Yarn doc)
Step 3.升級後跑測試，檢查有沒有哪邊地方壞掉
如果專案有寫測試，例如單元測試或是 E2E 測試都可以拿來跑看看，檢查有沒有地方因為升級後來沒做相對應的處理而受到影響。
總結
以上三點提供給讀者參考看看囉！每個月找一個時間來為專案的 dependencies 做個健檢吧，讓專案能夠繼續穩健的開發下去！