前言
問：都什麼年代了！怎麼還有人用webpack啊？
答：都什麼年代了怎麼還有人不會webpack啊！
其他：vite傲視群雄，你們都是弟弟
再其他：rspack、trubopack、farm等，你當我是空氣啊！
AI：我 chat-GPT來襲誰敢擋我！！！
小聲嘀咕：教練，我想學習webpack5...
那好！聽到有人說想學webpack5，我來了，嘿嘿！
以上觀點都對，但是我這裡要說一下，vite雖好，但可能不適合某些情景，在現在的專案中越來越多的需要用到專案融合：既：微前端（無界、micro-app、qiankun...國內外都有）,vite的開發環境和生產環境不一致，有些老外掛遇到就會出點問題，且微前端對vite的支援一直是個比較頭疼的問題，webpack雖然比較老。但至今webpack3.x依然有人在用。
rspack、trubopack、farm等對支援vue不是很好，還在開發中，不過react開發者有福了，推薦rspack，所以，老鐵們求你們學一下webpack吧。webpack5+SWC+ESBuilder+模組聯邦也不是很差事。
- 小夥伴們進入公司不乏也得維護老專案，不瞭解它的人大有人在。此教程隨為時已晚，但亡羊補牢也不是沒有作用。給那些前端幹了很多年或者入行不是很久的小夥伴們一次學習的機會，所以，教程來了！開搞！（為小聲嘀咕者發聲！）
nvm安裝
- nvm（nodejs version manager）：nodejs 版本管理工具，也就是說：一個 nvm 可以管理很多 node 版本和 npm 版本。
1.1 如果你電腦已經安裝了node，建議先解除安裝掉，再安裝nvm，否則有可能nvm無法切換node版本（也是為了省事）
1.2 nvm下載 ；windows平臺下載nvm-setup.zip這個安裝包，傻瓜式一鍵安裝即可。（linux和mac平臺自行去各個搜尋引擎找安裝方法）
1.3 開啟命令列視窗輸入nvm -v如果出現版本號就說明安裝成功了
- nvm（nodejs version manager）：nodejs 版本管理工具，也就是說：一個 nvm 可以管理很多 node 版本和 npm 版本。
使用nvm安裝node
2.1 命令列視窗輸入
nvm install 16.15.1就能安裝版本為16.15.1的node...
2.2 命令列視窗輸入nvm use 16.15.1就能使用當前安裝的版本
2.3 命令列視窗輸入nvm list就能檢視現在安裝的版本，前面帶符號的就是當前正在使用的版本nrm管理npm源
- nrm（npm registry manager）是npm的映象管理工具，有時候國外的資源太慢，使用這個就可以快速地在npm源間切換。
3.1 命令列視窗輸入npm install -g nrm即可安裝nrm
3.2 命令列視窗輸入nrm -V大寫的v, 可以看到版本號即可安裝成功
3.3 命令列視窗輸入nrm ls檢視可選源，或者使用nrm current檢視當前正在使用的npm源
3.4 命令列視窗輸入nrm use taobao就是切換到淘寶源
3.5 當你公司或個人有自己的npm源則可以透過命令nrm add <key> <url>key: 鍵，起個名字, url: 值，私有npm地址
3.6 能增加就能刪除nrm del <key>key：想要刪除的源名稱
3.7 測試一下你源連結速度nrm test <key>即可看到key源的響應時間
- nrm（npm registry manager）是npm的映象管理工具，有時候國外的資源太慢，使用這個就可以快速地在npm源間切換。
npm其他配置咋辦？
4.1 專案配置檔案：你可以在專案的根目錄下建立一個.npmrc檔案，只用於管理這個專案的npm安裝。輸入:
registry=https://registry.npm.taobao.org則在這個專案內執行npm命令操作時候就會讀取這個配置作用與當前專案
4.2 使用者配置檔案：在你使用一個賬號登陸的電腦的時候，可以為當前使用者建立一個.npmrc檔案，之後用該使用者登入電腦，就可以使用該配置檔案。可以透過npm config get userconfig來獲取該檔案的位置。
4.3 全域性配置檔案： 一臺電腦可能有多個使用者，在這些使用者之上，你可以設定一個公共的npmrc檔案，供所有使用者使用。該檔案的路徑為：$PREFIX/etc/npmrc，使用npm config get prefix獲取我的電腦必須配置代理才能上網，npm咋配置代理？
5.1 找到.npmrc或npmrc檔案給檔案加入
proxy=<url:port>url代理網路地址,port為代理網路端