序
gulp是什么?
Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务。Gulp.js 是基于 Node.js 构建的,利用 Node.js 流的威力,你可以快速构建项目并减少频繁的 IO 操作。Gulp.js 源文件和你用来定义任务的 Gulp 文件都是通过 JavaScript(或者 CoffeeScript )源码来实现的。
入门指南
gulp依赖于Node.js运行环境,所以在使用它之前需要先安装Node.js,另外我们还需要一个命令行工具Git-Bash来进行命令操作,本文的所有案例都假定在这些条件都满足的情况下进行。
1. 全局安装 gulp
为了让我们的电脑具有(或者说支持)gulp这个命令,我们需要在Git-Bash命令行工具里输入以下命令:
$ npm install -g gulp
检查是否安装成功可以输入以下命令:
$ gulp -v
[13:38:11] CLI version 3.9.1 //如果出现这一个行表明安装成功
2. 作为项目的开发依赖(devDependencies)安装
使用npm安装:
$ npm init -y //这个命令是初始化包管理文件package.json
$ npm install --save-dev gulp //--save-dev或者—D都表示作为开发依赖进行安装
或者使用yarn安装:
$ yarn init -y //这个命令是初始化包管理文件package.json
$ yarn add -D gulp //这个目前可能还不支持,但都是早晚的事情
安装完成后可以通过以下命令查看当前目录下以及全局安装的gulp版本:
$ gulp -v
[13:40:38] CLI version 3.9.1 //这个表示全局安装的gulp的版本信息
[13:40:38] Local version 3.9.1 //这个表示当前目录下安装的gulp的版本信息
注意: 全局安装的gulp只是让您的系统(电脑)增加了一个叫做gulp的命令,这个命令会调用当前目录下的 gulpfile.js
文件,并根据该文件的内容来执行相应的任务,而真正起到提供API功能的却是本地安装的gulp。
3.在项目根目录下创建一个名为 gulpfile.js 的文件
var gulp = require('gulp');
gulp.task('default', function() {
// 将你的默认的任务代码放在这
});
4.运行gulp
$ gulp
这个命令仅仅是执行了gulpfile.js中的 “default
” 的任务(通常叫做task
),如果需要指明执行哪一具体的任务,需要使用如下语法:
$ gulp taskName //taskName表示通过task方法定义的任务名称