Build 建置

把原始碼轉成可部署或可執行版本的過程。

先用一句話理解

把原始碼轉成可部署或可執行版本的過程。

打個比方

像把食材處理成可以上桌的餐點。

什麼時候會遇到

每次部署前、檢查專案是否能正式跑起來。

再往深一點看

Build 是把你寫的原始碼（TypeScript、JSX、SCSS 等）轉換成瀏覽器或伺服器實際能執行的格式——通常是壓縮過的 JavaScript 和靜態檔案。這個過程跟 dev 模式不一樣：dev server 是邊跑邊編譯、容許很多錯誤繼續跑，build 則是嚴格模式，任何 TypeScript 型別錯誤或無法解析的 import 都會讓它直接失敗。Next.js 的 next build 除了轉換程式碼，還會做靜態預渲染、路由分析、chunk 拆分等優化，讓上線後的頁面載入速度比 dev 模式快很多。Build 失敗最常見的原因是本機裝了某個套件但沒寫進 package.json、或有 typecheck 問題只被忽略而沒修，建置環境一旦乾淨重來就立刻爆出來。

舉個例子

你在本機執行 npm run build，Next.js 把你的頁面和 API routes 全部編譯一遍，輸出到 .next 資料夾。Vercel 部署時做的就是這一步——在它的伺服器上跑一次 build，成功才把產物部署出去，任何一個頁面有 import 錯誤都會讓整個部署失敗並自動回滾。

常見誤解

- 本機 dev server 跑得好就以為 build 一定會過，沒有在 push 前先跑一次 npm run build 確認，結果 Vercel 部署時才發現有 TypeScript 錯誤或缺少環境變數導致 build 失敗。
- 把只在 dev 模式需要的套件裝到 dependencies 而不是 devDependencies，或反過來把必要的 runtime 套件裝錯位置，build 產物在正式環境裡找不到模組而崩潰。
- 忽略 build 輸出的警告（warnings），以為「只是警告不是錯誤」，但部分框架在 production 模式下會把某些警告升級成錯誤，導致上線後才爆。