為什么要使用gulp：
一句話：自動化。對于需要反復(fù)重復(fù)的任務(wù)，例如壓縮（minification）、編譯、單元測試、linting等，
自動化工具可以減輕你的勞動，簡化你的工作。當(dāng)你正確配置好了任務(wù)，任務(wù)運(yùn)行器就會自動幫你或你的小組完成大部分無聊的工作。
這個是grunt對于javascript世界的構(gòu)建工具，也是gulp的存在意義。
gulp 官方網(wǎng)站http://gulpjs.com/
git網(wǎng)址 https://github.com/gulpjs/gulp
正題：
在我們從ionic 官方網(wǎng)站上down一下ionic start demo的時候里面會有兩個文件
gulpfile.js
package.json
gulpfile.js就是guip的核心，他有豐富的插件，共你用作各種功能。
gulp 相關(guān)的插件在https://www.npmjs.com基本上都可以找到，并且有簡單使用介紹。
這里面我僅做幾個例子，作為介紹，
首先要安裝 gulp
Install gulp globally:
npm install --global gulp
Install gulp in your project devDependencies:
//這邊安裝完之后，會在package.json里面，以后只有package.json里面有相關(guān)依賴，可以直接ionic install 就可以吧所有依賴安裝了
- npm install —-save-dev gulp
比如，圖片壓縮https://www.npmjs.com/package/gulp-imagemin
先安裝相關(guān)插件
- 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');//原文件中已經(jīng)存在
- 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
相關(guān)的圖片就被壓縮到/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);
- });
運(yùn)行g(shù)ulp.sass就可以運(yùn)行了。如果一個gulpfile.js里面有很多這樣的risk那么：
- gulp.task('default',['imagemin', 'sass']
運(yùn)行g(shù)ulp就可以了。
gulp 還有很多功能，監(jiān)視，語法檢測，等等，都有相關(guān)插件，只要有需要去加入相應(yīng)的risk就可以了。
注意點(diǎn)：
1.在打包的時候，由于Jetbrains-idea 里面ionic build android 的時候是針對www文件下的，而我們gulp的目標(biāo)路徑肯定不能是本路徑，如果可以，配置一下，讓build 的默認(rèn)路徑變成dest （代碼里生成的），那么就可以直接build了
但是我圖省事，就直接把www里面代碼覆蓋了。
2.
照此方法，理論上是可行的，但是由于電腦不爭氣。罷工了。以上內(nèi)容待測試。
參考文獻(xiàn)：
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/ 整個流程的實例
