談?wù)刧runt和gulp的區(qū)別？自從nodejs進(jìn)入前端階段以來(lái)，自動(dòng)化建筑已經(jīng)變得越來(lái)越流行。目前，最流行的是咕嚕和咕嚕。它們有相似的名字和相似的功能。不過(guò)，在大哥咕噥的情況下，咕噥可以打開自己的世

談?wù)刧runt和gulp的區(qū)別？

自從nodejs進(jìn)入前端階段以來(lái)，自動(dòng)化建筑已經(jīng)變得越來(lái)越流行。目前，最流行的是咕嚕和咕嚕。它們有相似的名字和相似的功能。不過(guò)，在大哥咕噥的情況下，咕噥可以打開自己的世界。它有她獨(dú)特的優(yōu)點(diǎn)。

1. 與grunt相比，易于使用的gulp更簡(jiǎn)潔，遵循代碼比配置策略更好。維護(hù)gulp更像是編寫代碼。

2. 與咕嚕聲相比，高效的咕嚕聲更具設(shè)計(jì)感。核心設(shè)計(jì)基于UNIX流的概念，通過(guò)管道連接，不需要編寫中間文件。

3. 每個(gè)高質(zhì)量的gulp插件只完成一個(gè)功能，這也是UNIX的設(shè)計(jì)原則之一。每個(gè)功能都通過(guò)流進(jìn)行集成，以完成復(fù)雜的任務(wù)。例如，grunt的imagemin插件不僅壓縮圖像，還包括緩存。他說(shuō)，在gulp中，cache是另一個(gè)可以被其他插件使用的插件，這促進(jìn)了插件的可重用性。目前，有673個(gè)插件正式上市。

4. 只有五個(gè)核心api可供簡(jiǎn)單易學(xué)的gulp使用。如果您掌握了這五個(gè)api，就可以學(xué)習(xí)gulp，然后可以通過(guò)pipeline flow組合您想要的任務(wù)。

5. 在使用grunt進(jìn)行I/O的過(guò)程中，會(huì)生成一些中間臨時(shí)文件，一些任務(wù)會(huì)生成臨時(shí)文件，其他任務(wù)會(huì)根據(jù)臨時(shí)文件進(jìn)行處理并生成最終的生成后文件。使用gulp的優(yōu)點(diǎn)是以流的方式處理文件，并通過(guò)管道連接多個(gè)任務(wù)和操作。因此，只有一個(gè)I/O進(jìn)程，進(jìn)程更清晰、更純粹。

6. 代碼比配置維護(hù)好，gulp更像是編寫代碼，gulp遵循常見(jiàn)的JS規(guī)范，因此與編寫節(jié)點(diǎn)程序沒(méi)有區(qū)別。

webpack和gulp的區(qū)別？

咕嚕聲應(yīng)該與咕嚕聲相比較。我不談他們之間的區(qū)別。我們來(lái)談?wù)勊挠猛?。Gulp/grunt是一個(gè)優(yōu)化前端工作流的工具。例如，自動(dòng)刷新頁(yè)面、組合、壓縮CSS、JS、編譯less等等。簡(jiǎn)而言之，就是使用gulp/grunt，然后配置您需要的插件，這樣您就可以讓它手動(dòng)完成您需要做的事情。當(dāng)涉及到browse/webpack時(shí)，也涉及到seajs/requirejs。這四個(gè)是JS模塊化解決方案。Seajs/require是一種類型，browse/webpack是另一種類型。Seajs/require：是一個(gè)在線“編譯”模塊解決方案，相當(dāng)于在頁(yè)面上加載CMD/AMD解釋器。這樣，瀏覽器就可以了解define、exports和module。實(shí)現(xiàn)了模塊化。Browserify/webpack：是一種預(yù)編譯模塊方案，比上述方案更智能。我沒(méi)用過(guò)browserify。這里我們以webpack為例。首先，它是預(yù)編譯的，不需要在瀏覽器中加載解釋器。另外，您可以直接在本地編寫JS。無(wú)論是amd/CMD/ES6風(fēng)格的模塊化，它都能識(shí)別并編譯成瀏覽器能識(shí)別的JS。這樣一來(lái)，gulp就是一個(gè)工具，而webpack等都是模塊化的解決方案。Gulp還可以為seajs、requirejs甚至webpack配置插件。