gulp安装详解、及less

gulp是基于Nodejs的自动任务运行器， 它能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件的的测试、检查、合并、压缩、格式化、浏览器自动刷新、部署文件生成，并监听文件在改动后重复指定的这些步骤


gulp的安装步骤:
首先安装nodejs，通过nodejs的npm全局安装和项目安装gulp，其次在项目里安装所需要的gulp插件，然后新建gulp的配置文件gulpfile.js并写好配置信息（定义gulp任务），最后通过命令提示符运行gulp任务即可.


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

第一步 首先安装nodejs；

第二步  打开cmd；在左下角输入 cdm  并打开；

 输入安装  在哪个盘 及文件夹名称； 注意输入哪个盘 后面要加上 “：”，文件夹=cd+“文件夹名称” ，如下图

第三步 下载gulp文件；

  地址：

 npm install cnpm -g --registry=https://registry.npm.taobao.org； 

 npm install cnpm -g表示全局安装；

直接在文件 后面  输入“ npm install cnpm -g --registry=https://registry.npm.taobao.org； ”  ——》回车；

第四步 下载后 执行  “cnpm  -v” ；查看版本  如果出现版本号  说明下载成功；

第五步  输入“cnpm init” 自动生成一个 package.json 文件；

注意 ：   在 name：（gulp）输入 “test” 往下三u行都要输入  见下图；

其他不需要输入  直接  回车 往下 知道看见 is this ok （ys）；输入“y”；见下图

第六步 执行本地安装 gulp ； 见下图

第七步  安装less插件

第八步 在文件夹中建一个 名字为 css 的文件夹  再在css文件夹中新建一个  index.less 文件 

第九步 在文件夹中建一个  gulpfile.js 文件；

“

var gulp = require('gulp'), //本地安装gulp所用到的地方
    less = require('gulp-less');

//定义一个testLess任务（自定义任务名称）
gulp.task('testLess', function () {
    gulp.src('css/index.less') //该任务针对的文件
        .pipe(less()) //该任务调用的模块
        .pipe(gulp.dest('css')); //将会在css下生成index.css
});

gulp.task('default',['testLess']); //定义默认任务

”

第九步  执行 gulp testLess   如果出现下图 所示 则执行第十步；

第十步 重新本地安装 gulp  “cnpm install gulp--save-dev  //本地安装gulp”；

第十一步 ；执行“gulp”     ,    index.less生成index.css ;

第十二步  查看是否生成 index.css 如果生成  说明安装成gulp；

回看第八步还没有生成index.css；