gulp和webpack之間的區別

2021-10-01 13:31:00 字數 660 閱讀 8948

gulp是為了規範前端開發流程,實現前後端分離、模組化開發、版本控制、檔案合併、壓縮、mock資料等功能的乙個前端自動化構建工具。

強調的是前端開發的工作流程,我們可以通過配置一系列的task(gulp中的gulp.task()方法配置),定義task處理的事務(例如檔案壓縮合併、雪碧圖、啟動server、sass/less預編譯、版本控制等)然後定義執行順序,來讓gulp執行這些task,從而構建專案的整個前端開發流程。核心是 task runner。

webpack是當下最熱門的前端資源模組化管理和打包工具,成為模組打包機。

它可以將許多鬆散的模組按照依賴和規則打包成符合生產環境部署的前端資源。還可以將按需載入的模組進行**分隔,等到實際需要的時候再非同步載入。通過 loader的轉換,任何形式的資源都可以視作模組,比如 commonjs 模組、amd 模組、es6 模組、css、、json、coffeescript、less 等

gulp和webpack的側重點是不同的

(gulp側重於開發整個過程的控制管理)

(webpack更側重於模組打包)

gulp和webpack基本都能滿足前端自動化構建工具的任務,但還是看出兩個工具的側重點,gulp側重整個過程的控制,webpack在模組打包方面有特別出眾。

所以,在一定情況下 gulp + webpack 組合使用可能更方便

Gulp和Webpack的區別

gulp 強調的是前端開發的流程,通過配置一系列的task,定義task處理的事務 例如 檔案壓縮合併,啟動server 然後定義執行順序,來讓gulp執行task,從而構建其前端專案的流程。合併後仍然是你寫的 只是區域性變數名被替換,一些語法做了轉換而已,整體內容並沒有發生改變。webpack 側...

Gulp和Webpack的區別

gulp和webpack的基本區別 gulp可以進行js,html,css,img的壓縮打包,是自動化構建工具,可以將多個js檔案或是css壓縮成乙個檔案,並且可以壓縮為一行,以此來減少檔案體積,加快請求速度和減少請求次數 並且gulp有task定義處理事務,從而構建整體流程,它是基於流的自動化構建...

webpack和gulp的比較

打包主要解決的問題有 1.檔案依賴管理 2.資源載入管理 3.效率與優化管理 打包工具的結構應該是tool plugins的結構,tool提供基礎能力,即檔案依賴管理和資源載入管理,在此基礎上通過一系列的plugins來豐富打包工具的能力,plugins類似網際網路 的概念,檔案經plugins處理...