Gulp和Webpack

Gulp

    gulp.js简单来说就是一种基于流的,代码优于配置的新一代构建工具

安装

    gulp基于nodejs,必须在node环境下配置,npm安装较慢,推荐使用cnpm(淘宝镜像)

    1.cnpm install -g gulp  全局安装gulp

    2.cnpm install --save-dev gulp

    3.cnpm install gulp-jshint --save-dev  安装gulp-jshint

    4.创建gulpfile.js

    5.gulp lint 最后执行命令

Webpack

    webpack是一个前端资源加载打包工具,将根据模块的依赖关系进行静态分析将这些模块按照指定的规则生成对应的静态资源

安装

    webpack基于nodejs,这一点和gulp是一样的,必须在node环境下

    1.cnpm install webpack -g    全局安装webpack

    2.mkdir app  创建一个目录app

    3.在app目录下创建one.js   document.write("Hello World")

    4.在app目录下添加index.html文件  动态添加script标签 引入webpack配置文件

    5.webpack one.js bundle.js   打包

Gulp和Webpck区别

    Gulp强调的是前端开发的工作流程,通过配置一系列的tesk,让gulp执行这些task,从而构建整个项目的开发流程

    Webpack是一个前端模块化方案,它更侧重的使模块打包

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 在现在的前端开发中,前后端分离、模块化开发、版本控制、文件合并与压缩、mock数据等等一些原本后端的思想开始...
    Charlot阅读 10,837评论 1 32
  • 前言 众所周知目前比较火的工具就是gulp和webpack,但webpack和gulp却有所不同,本人两者的底层研...
    cduyzh阅读 5,199评论 0 13
  • 在现在的前端开发中,前后端分离、模块化开发、版本控制、文件合并与压缩、mock数据等等一些原本后端的思想开始逐渐渗...
    彬_仔阅读 25,702评论 21 139
  • 在我刚接触前端开发的时候,已经开始流行各种构建工具了;而当我上手gulp以后,webpack又大行其道了。所以,对...
    悟空leo阅读 4,829评论 0 2
  • 一直在使用,也没时间说,今天来介绍下gulp 和webpack的安装使用还有就是区别 首先先明白gulp和webp...
    一点代码阅读 3,051评论 0 0