windows下零基础gulp构建

在学习前，先谈谈大体使用gulp的步骤，给读者以初步的认识。首先固然是安装nodejs，经过nodejs的npm全局安装和项目安装gulp，其次在项目里安装所须要的gulp插件，而后新建gulp的配置文件gulpfile.js并写好配置信息（定义gulp任务），最后经过命令提示符运行gulp任务便可。

安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务

一、安装nodejs　　

gulp是基于nodejs，理所固然须要安装nodejs

二、使用命令行

简单介绍gulp在使用过程当中经常使用命令，打开命令提示符执行下列命令（打开方式：window + r 输入cmd回车）：

node -v查看安装的nodejs版本，出现版本号，说明刚刚已正确安装nodejs。PS：未能出现版本号，请尝试注销电脑重试；

npm -v查看npm的版本号，npm是在安装nodejs时一同安装的nodejs包管理器，

cd定位到目录，用法：cd + 路径 ；

dir列出文件列表；

cls清空命令提示符窗口内容。

三、npm介绍

说明：npm（node package manager）nodejs的包管理器，用于node插件管理（包括安装、卸载、管理依赖等）；

使用npm安装插件：命令提示符执行npm install <name> [-g] [--save-dev]；

<name>：node插件名称。例：npm install gulp-less --save-dev

-g：全局安装。将会安装在C:\Users\Administrator\AppData\Roaming\npm，而且写入系统环境变量；  非全局安装：将会安装在当前定位目录；  全局安装能够经过命令行在任何地方调用它，本地安装将安装在定位目录的node_modules文件夹下，经过require()调用；

--save：将保存配置信息至package.json（package.json是nodejs项目配置文件）

-dev：保存至package.json的devDependencies节点，不指定-dev将保存至dependencies节点；通常保存在dependencies的像这些express/ejs/body-parser等等。

为何要保存至package.json？由于node插件包相对来讲很是庞大，因此不加入版本管理，将配置信息写入package.json并将其加入版本管理，其余开发者对应下载便可（命令提示符执行npm install，则会根据package.json下载全部须要的包，npm install --production只下载dependencies节点的包）。

四、选装cnpm

官方网址：http://npm.taobao.org；

安装：命令提示符执行npm install cnpm -g --registry=https://registry.npm.taobao.org；  注意：安装完后最好查看其版本号cnpm -v或关闭命令提示符从新打开，安装完直接使用有可能会出现错误；

注：cnpm跟npm用法彻底一致，只是在执行命令时将npm改成cnpm（如下操做将以cnpm代替npm）。

五、全局安装gulp

说明：全局安装gulp目的是为了经过她执行gulp任务；

安装：命令提示符执行cnpm install gulp -g

查看是否正确安装：命令提示符执行gulp -v，出现版本号即为正确安装。

六、新建package.json文件

说明：package.json是基于nodejs项目必不可少的配置文件，它是存放在项目根目录的普通json文件；

命令提示符执行cnpm init   直接安装

七、本地安装gulp插件

安装：定位目录命令后提示符执行cnpm install --save-dev；

 

 

九、运行gulp

命令提示符执行gulp 任务名称；