早期 (Pre-2010s)：在 javascript 的初期，開發者通常直接使用 <script> 標籤在 HTML 中引入 JS 檔案，沒有專門的打包工具。隨著網頁應用程序變得更複雜，管理多個 JS 檔案的依賴關係變得困難。

CommonJS 與 Browserify (2010s 初期)：CommonJS 模塊標準在 Node.js 中被廣泛採用，允許開發者使用 require() 來導入模塊。Browserify 出現後，讓開發者可以將 Node.js 的模塊化體系引入到瀏覽器中，並將多個模塊打包成一個 JS 檔案。

Webpack 與 ES Modules (2014 - 2016)：Webpack 推出了更加靈活的打包方式，支持各種格式（如 ES Modules、CommonJS），並引入了 loader 和 plugin 等概念來處理不同類型的資源，迅速成為主流工具。隨後，ES2015 引入了 ES Modules（import/export 語法），成為瀏覽器和 Node.js 的標準模塊系統。

Rollup、Parcel 與其他工具 (2016 - 2018)：Rollup 針對 ES Modules 提供了更加專注於輸出高效代碼的打包方式，而 Parcel 則主打零配置、快速打包的特性，使開發者更容易上手。

Pika Web (2018)：Pika Web 是 Pika 團隊（後來開發 Snowpack）推出的一套工具，用於將 npm 模塊轉換為可以直接在瀏覽器中使用的 ES Modules。它的理念是利用瀏覽器原生支持 ES Modules 的特性，避免將所有代碼打包成一個大文件，而是保留模塊化的結構，從而加速開發環境中的運行速度。

Snowpack (2019)：隨著 Pika Web 的進化，Snowpack 出現了，成為一個基於 ES Modules 的開發工具。它與傳統打包工具（如 Webpack）不同，不會對整個應用進行「bundling」（打包），而是僅在需要時將各個模塊編譯或轉換，這種方式極大地加速了開發過程。Snowpack 主要著眼於開發時的快速反饋，讓應用可以直接使用未打包的 ES Modules，僅在生產環境下才對代碼進行最小化和優化。

新一代工具與 Vite (2020s 初期)：Vite 和 esbuild 等工具著眼於更快的開發和打包體驗，利用瀏覽器原生 ES Modules 支持，降低了開發中的打包時間。Vite 尤其在前端框架如 Vue 和 React 社區中獲得廣泛認可。