资讯专栏INFORMATION COLUMN

gulp 与 Webpack 的 异曲同工之处

jackwang / 1822人阅读

摘要:所以我么的都会写到中当然可以采用插件将文件抽离,我的文章有写到更侧重于通过加载器的编译转换,可以将任何形式的文件都会打包成模块例如模块模块图片模块媒体模块等等。

gulp
我们可以认为是前端开发的生产线,gulp.task()则是每台运作的机器,

当启动gulp的时候,电闸就会被合上,所有的机器开始工作,

启动本地server ,编译sass,编译commenjs,多chrunk文件,打包压缩,mock数据等,都各干各的,哪里来src就通过配置到哪里去dist

gulp 主要关注点是 track() 当生产间没有机器的运作 很难将各个文件 加工成结果文件
webpack
webpack则不同 他更侧重于 工程化,是模块化的打包机,是对各种资源进行模块化,

他主要处理各种各个模块的依赖文件,只要模块间有依赖 都会进行处理,不是该模块的,就不会受影响

不同与gulp的路劲配置,会使得路径下的各个文件都可能会受影响

webpack对各个模块的管理 主要通过入口文件app.js建立依赖关系。

所以我么的js、css都会写到app.js中 当然可以采用插件将css文件抽离,我的webpack文章有写到

webpack更侧重于 loader 通过loader加载器的编译 转换 ,可以将任何形式的文件都会打包成模块 例如:js模块、css模块、图片模块、媒体模块等等。
综上所述
gulp 和 webpack 都可以实现 文件的打包压缩,启动服务,mock数据,编译sass,编译es6等,只是侧重点不同而已,
但是 gulp可以引入webpack,引入gulp-webpack就可以,而webpack则对gulp再次封装,引入了loader 将项目模块化更彻底,二者相辅相成......


个人理解,如果有什么欠缺的会继续补充.....

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/92031.html

相关文章

  • webpack 3 零基础入门教程 #1 - 介绍

    摘要:所以它在某些程度上,跟的功能有些相同。严格上讲,模块化不是他强调的东西,他旨在规范前端开发流程。更是明显强调模块化开发,而那些文件压缩合并预处理等功能,不过是他附带的功能。 1. webpack 是什么? showImg(https://segmentfault.com/img/remote/1460000012293461); 先来说一下 webpack 是什么。 webpack 的...

    张红新 评论0 收藏0
  • PostCSS自学笔记(一)【安装使用篇】

    摘要:而则可制定个人需求的一套解决方案仅安装需要的插件。迫不及待的你已经等不及安装使用了吧。安装及使用一般是结合自动化工具使用,如果要单独使用可以安装,这里我先对的安装使用讲解下。接下来说点实际的,如何利用结合自动化工作在项目中使用。 PostCSS介绍 PostCSS是一个利用JS插件来对CSS进行转换的工具,这些插件非常强大,强大到无所不能。其中,Autoprefixer就是众多Post...

    jsummer 评论0 收藏0
  • 前端模块化和构建工具

    摘要:以前一直对前端构建工具的理解不深,经过几天的研究特意来总结一下,第一次写博客,有写错的请多多见谅,该文章我也从其他博客拷了一些内容,如果有冒犯之处,请指出。强大的设计使得它更像是一个构建平台,而不只是一个打包工具。 以前一直对前端构建工具的理解不深,经过几天的研究特意来总结一下,第一次写博客,有写错的请多多见谅,该文章我也从其他博客拷了一些内容,如果有冒犯之处,请指出。 如今,网页不再...

    ad6623 评论0 收藏0
  • 基于 Gulp + Browserify 构建 ES6 环境下自动化前端项目

    摘要:本文特此给大家介绍下如何使用配合来构建基于的前端项目。最后,在目录下会生成最终的项目文件。执行单元测试本例中使用进行单元测试。 随着React、Angular2、Redux等前沿的前端框架越来越流行,使用webpack、gulp等工具构建前端自动化项目也随之变得越来越重要。鉴于目前业界普遍更流行使用webpack来构建es6(ECMAScript 2015)前端项目,网上的相关教程也比...

    yuanxin 评论0 收藏0
  • 基于koajsweb项目构建(二)

    摘要:根据基于的项目构建一所描述的,建立了项目的基本目录结构,接下来的工作便是编码,编译,测试,发布。对于自己,仅作文去尝试清楚的阐述自己构建项目的一些实践。随意的编码风格最终导致项目代码的可维护性低,新加入成员学习成本提高。 根据 基于koajs的web项目构建(一) 所描述的,建立了项目的基本目录结构,接下来的工作便是编码,编译,测试,发布。做为这些工作,每一项工作都有自己的学问,针对这...

    ZweiZhao 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<