建置與工具
打包工具(bundler)
打包工具(bundler)會把你那一大堆原始檔——JavaScript、CSS、圖片,以及它們引入的各種套件——拼接成幾個又小又優化的檔案,讓瀏覽器能快速下載並執行。你把程式碼拆在幾十個清爽的小檔案裡寫,打包工具則把它們打包好、準備上路。
它一路上還會順手收拾:刪掉沒用到的程式碼、壓縮檔案體積、把較新的語法翻譯成舊瀏覽器也能看懂的寫法。結果是下載次數大大減少,頁面載入更快。
如今常見的有 Vite、webpack 和 esbuild。你多半是透過一個「建置(build)」步驟接觸到打包工具——它把你易讀的專案,變成真正發布出去的那份精簡包。
$ npx vite build dist/assets/index-4f9a.js 142 kB │ gzip: 46 kB
幾十個原始檔變成了一個又小又優化的包。
它的誕生,是因為瀏覽器並非總能高效地載入大量小模組。
又稱
另見