Gulp:新一代前端构建利器
1、什么是Gulp
gulp.js 是一种基于流的,代码优于配置的新一代构建工具。
Gulp
和 Grunt
类似。但相比于 Grunt
的频繁的 IO
操作,Gulp
的流操作,能更快地完成构建。
2、Gulp特性
- 使用方便
通过代码优于配置的策略,Gulp
可以让简单的任务简单,复杂的任务更可管理。
- 构建快速
通过流式操作,减少频繁的 IO
操作,更快地构建项目。
- 插件高质
Gulp
有严格的插件指导策略,确保插件能简单高质的工作。
- 易于学习
少量的API,掌握Gulp
可以毫不费力。构建就像流管道一样,轻松加愉快。
3、Gulp安装
Gulp
是基于 Node.js
的,故要首先安装 Node.js
- npm install -g gulp
- npm install —-save-dev gulp
4、Gulp使用
Gulp
的任务都是以插件的形式存在,本次示例以 gulp-jshint 为例,展示Gulp
的常规用法。
安装 gulp-jshint
- npm install gulp-jshint --save-dev
创建 gulpfile.js
gulp项目页 有一个 Sample gulpfile
。如果不会写的话,直接参考一下就OK了。
- var gulp = require('gulp');
- var jshint = require('gulp-jshint');
- var paths = {
- scripts: 'js/**/*.js',
- };
- gulp.task('lint', function() {
- return gulp.src(paths.scripts)
- .pipe(jshint())
- .pipe(jshint.reporter('default'));
- });
然后执行命令行
- gulp lint
即可。
5、Gulp总结
Gulp
相比于 Grunt
有很多优点,比较直观的:就是学习曲线比较平滑。比Grunt速度更快、配置更少。
当然,Gulp
还有很多高级的特性,详见官方文档
Gulp插件列表
Gulp:新一代前端构建利器的更多相关文章
- 仿async/await(一)and Gulp:新一代前端构建利器
NET 4.5的async/await真是个神奇的东西,巧妙异常以致我不禁对其实现充满好奇,但一直难以窥探其门径.不意间读了此篇强文<Asynchronous Programming in C# ...
- 前端构建利器Grunt—Bower
runt + Bower—前端构建利器 目前比较流行的WEB开发的趋势是前后端分离.前端采用重量级的Javascript框架,比如Angular,Ember等,后端采用restful API的Web ...
- 使用Gulp实现前端构建自动化
使用Gulp实现前端构建自动化 安装 一.安装NodeJs Gulp的安装依赖于NodeJs的npm安装管理器 安装包下载地址 关于npm命令: 1. npm install <name> ...
- Grunt + Bower—前端构建利器(转)
目前比较流行的WEB开发的趋势是前后端分离.前端采用重量级的Javascript框架,比如Angular,Ember等,后端采用restful API的Web Service服务,通过JSON格式进行 ...
- Grunt + Bower—前端构建利器
目前比较流行的WEB开发的趋势是前后端分离.前端采用重量级的Javascript框架,比如Angular,Ember等,后端采用restful API的Web Service服务,通过JSON格式进行 ...
- 前端构建大法 Gulp 系列 (四):gulp实战
前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gulp专家 前 ...
- 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gulp专家
系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...
- 前端构建大法 Gulp 系列 (二):为什么选择gulp
系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...
- 前端构建大法 Gulp 系列 (一):为什么需要前端构建
系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...
随机推荐
- 详解Bootstrap按钮组件
按钮组也是一个独立的组件,所以可以找到相应的源码文件: Less:buttons.less Sass:_buttons.scss Css:Bootstrap.css 3131行~3291行 按钮 ...
- Ruby on Rails框架开发学习
学习地址:http://www.ixueyun.com/lessons/detail-lessonId-685.html 一.课程概述 软件开发在经历了面向过程编程的阶段,现在正大行其道的是敏捷开发, ...
- GO語言基礎教程:流程控制
在開始一個新的章節之前先來回顧上一篇文章的部份,首先我們來看這段代碼: package main import ( "fmt" ) func main(){ var x,y int ...
- linux下查看磁盘空间 [转]
如果要查看磁盘还剩多少空间,当然是用df的命令了. [root@localhost ~]# df -h 文件系统 容量 已用 可用 已用% 挂载点 /dev/sda2 ...
- [转]Java Spring的Ioc控制反转Java反射原理
转自:http://www.kokojia.com/article/12598.html 学习一个东西的时候,如果想弄明白,最好想想框架内部是如何实现的,如果是我做我会怎么实现.下面我就写一个Ioc ...
- [转] Python 代码性能优化技巧
选择了脚本语言就要忍受其速度,这句话在某种程度上说明了 python 作为脚本的一个不足之处,那就是执行效率和性能不够理想,特别是在 performance 较差的机器上,因此有必要进行一定的代码优化 ...
- 超体.特效中英字幕.Lucy.2014.BD1080P.X264.AAC.English&Mandarin.CHS-ENG
资源名称 其它信息 资源大小 BT下载 超体.Lucy.2014.BD-MP4-原创翻译中英双语字幕.mp4 seeders: / leechers: 511.15MB 下载 [飘域家园]移动迷宫.T ...
- 用ASP.NET Core 1.0中实现邮件发送功能
准备将一些项目迁移到 asp.net core 先从封装类库入手,在遇到邮件发送类时发现在 asp.net core 1.0中并示提供SMTP相关类库,于是网上一搜发现了MailKit 好东西一定要试 ...
- Modbus通讯协议学习 - 串口调试
概述 我们在做任何事情之前都需要获取很多 调试步骤: 1:485转换器连接硬件 2:485转换器上的USB接口连接电脑. 3:打开设备管理器 ->查看端口 4:打开串口调试工具,在串口配置的地方 ...
- SQL Server 2016 需要单独安装SSMS
默认安装完 MSSQL 后,不自带 SSMS 的管理工具了,需要的话可以单独安装,貌似更专业了一些. https://msdn.microsoft.com/library/mt238290.aspx ...