2

gulp是什么?

 10 months ago
source link: https://blog.p2hp.com/archives/11240
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Lenix Blog

gulp官方入门安装:https://gulpjs.com/docs/en/getting-started/quick-start

Gulp 和Webpack的基本区别:
gulp可以进行js,html,css,img的压缩打包,是自动化构建工具,可以将多个js文件或是css压缩成一个文件,并且可以压缩为一行,以此来减少文件体积,加快请求速度和减少请求次数;并且gulp有task定义处理事务,从而构建整体流程,它是基于流的自动化构建工具。

Webpack是前端构建工具,实现了模块化开发和文件处理。他的思想就是“万物皆为模块”,它能够将各个模块进行按需加载,不会导致加载了无用或冗余的代码。所以他还有个名字叫前端模块化打包工具。

在实际当中会将两种都选择混合使用。虽然两个都可以进行代码的压缩合并减少代码体积,但gulp.config.js中gulp的代码更加简单易懂,需要压缩合并谁就用哪个方法,而webpack样式合并需要在node环境下下载插件才能使用。另一点,gulp 是基于流的打包工具,需要谁,引用谁,并且他的压缩简单明了,后期维护起来方便,webpack则可以将具体的模块进行划分,需要哪个模块就加载哪个模块,实现按需加载,并且排除掉冗余代码,减少代码体积。

总结起来就是,gulp是基于流的自动化构建工具,但不包括模块化的功能,如果要用到的话,就需要引入外部文件,比如require.js等;而webpack是自动化模块打包工具,本身就具有模块化,并且也具有压缩合并的功能。二者侧重点不同,我认为相互结合使用会提高代码质量和代码的优化。


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK