gulp經常使用組件【study筆記】

// 項目控件引入//及對應的說明
var gulp = require('gulp');
var less = require('gulp-less'); //less編譯
var concat = require('gulp-concat'); //CSS 合併
var cleanCss = require('gulp-clean-css'); //css壓縮
var del = require('del'); //刪除文件/文件夾
var babel = require('gulp-babel'); //ECMA6 -> ECMA5
var uglify = require('gulp-uglify'); //壓縮js
var rename = require('gulp-rename'); //文件更名
var imagemin = require('gulp-imagemin'); //圖片壓縮
var spriter = require('gulp-css-spriter'); //將圖片處理成 雪碧圖【即多張圖片資源處理成一張組合圖】
var base64 = require('gulp-base64'); // 將url資源文件進行base64字節碼處理
var browserSync = require('browser-sync').create(); //建立實例 ，瀏覽器實時快速響應文件更新自動刷新
var reload = browserSync.reload;
var rev = require('gulp-rev'); //版本控制
var revCollector = require('gulp-rev-collector'); //版本控制 對（映射文件）對應修改
var notify = require('gulp-notify'); //消息通知//便可經過服務端向終端發送指定消息，通知等
var runSequence = require('run-sequence'); //項目操做流程控制前後順序等【即控制task任務執行順序】

GulpTaskDemo

實例地址 GitHub

一個簡單的gulp實例Demo，經過run-Sequence控制項目流程 分別建立了 開發環境服務和生產環境服務

項目中文件夾等說明

build 放置編譯處理後發佈的 即生產環境文件夾
src 中放置源代碼/文件/靜態資源等

git down下來的代碼須要 進行 npm install 安裝一下package.json中相應組件