gulp应用于ionic概述

为什么要使用gulp：
一句话：自动化。对于需要反复重复的任务，例如压缩（minification）、编译、单元测试、linting等，
自动化工具可以减轻你的劳动，简化你的工作。当你正确配置好了任务，任务运行器就会自动帮你或你的小组完成大部分无聊的工作。
这个是grunt对于javascript世界的构建工具，也是gulp的存在意义。
gulp 官方网站http://gulpjs.com/
git网址 https://github.com/gulpjs/gulp
正题：
在我们从ionic 官方网站上down一下ionic start demo的时候里面会有两个文件
gulpfile.js
package.json
gulpfile.js就是guip的核心，他有丰富的插件，共你用作各种功能。
gulp 相关的插件在https://www.npmjs.com基本上都可以找到，并且有简单使用介绍。
这里面我仅做几个例子，作为介绍，
首先要安装 gulp

Install gulp globally:

npm install --global gulp

Install gulp in your project devDependencies:

//这边安装完之后，会在package.json里面，以后只有package.json里面有相关依赖，可以直接ionic install 就可以吧所有依赖安装了

npm install —-save-dev gulp

比如，图片压缩https://www.npmjs.com/package/gulp-imagemin
先安装相关插件

npm install --save-dev gulp-imagemin
npm install --save-dev imagemin-pngquant //这个是依赖

只要在gulpfile.js文件中加入如下代码：

var paths = {
    sass        : ['./scss/**/*.scss'],
    javascript  : ['./www/js/**/*.js'],
    image       : ['./www/img/*']
};
var gulp = require('gulp');//原文件中已经存在
var imagemin = require('gulp-imagemin');
var pngquant = require('imagemin-pngquant');

gulp.task('imagemin', function () {
    return gulp.src(paths.image)
        .pipe(imagemin({
            progressive: true,
            svgoPlugins: [{removeViewBox: false}],
            use: [pngquant()]
        }))
        .pipe(gulp.dest('./dest/img'));
});

然后在项目的跟目录中输入 gulp imagemin 
相关的图片就被压缩到/dest/img，
再比如（这个，知道怎么个 意思，但是由于文件比较少，效果不是很好，这个是源文件中本来就有的）

var sass = require('gulp-sass');
var minifyCss = require('gulp-minify-css');
var rename = require('gulp-rename');


gulp.task('sass', function (done) {
    gulp.src(paths.sass)
        .pipe(sass())
        .pipe(gulp.dest('./www/css/'))
        .pipe(minifyCss({
            keepSpecialComments: 0
        }))
        .pipe(rename({extname: '.min.css'}))
        .pipe(gulp.dest('./www/css/'))
        .on('end', done);
});

运行gulp.sass就可以运行了。如果一个gulpfile.js里面有很多这样的risk那么：

gulp.task('default',['imagemin', 'sass']

运行gulp就可以了。
gulp 还有很多功能，监视，语法检测，等等，都有相关插件，只要有需要去加入相应的risk就可以了。
注意点：
1.在打包的时候，由于Jetbrains-idea 里面ionic build android 的时候是针对www文件下的，而我们gulp的目标路径肯定不能是本路径，如果可以，配置一下，让build 的默认路径变成dest （代码里生成的），那么就可以直接build了
但是我图省事，就直接把www里面代码覆盖了。
2.
照此方法，理论上是可行的，但是由于电脑不争气。罢工了。以上内容待测试。


参考文献：
http://www.tuicool.com/articles/uMBZ7fB
http://www.smashingmagazine.com/2014/06/11/building-with-gulp/ 一些语法的讲解，还有文件match
http://markgoodyear.com/2014/01/getting-started-with-gulp/ 整个流程的实例