由於專案中經常會使用到gulp，而每次配置大概都差不多，所以將配置記錄一下
├─dist
│ ├─assets
│ ├─css
│ ├─images
│ └─js
├─node_modules
└─src
├─assets
│ ├─css
│ ├─echarts
│ ├─js
│ ├─odometer
│ └─外掛程式等
├─less
├─images
└─js
/*
* @gulp：自動化任務
*/var gulp = require('gulp');
var rm = require('del'); //刪除檔案
var browsersync = require('browser-sync');
var reload = browsersync.reload; //自動重新整理
var htmlmin = require('gulp-htmlmin'); //壓縮html
var minicss = require('gulp-clean-css'); //壓縮css
var minijs = require('gulp-uglify'); //壓縮js
var less = require('gulp-less'); //編譯less
var autoprefixer = require('gulp-autoprefixer'); // 補全瀏覽器字首
var babel = require('gulp-babel'); // es6 轉 es5
var replace = require('gulp-replace'); // 替換
var proxymiddleware = require('http-proxy-middleware'); // **跨域
/** * 配置
*/var config = ,
// **設定
middleware: proxymiddleware('/api', ,
})};/*清除產出目錄*/
gulp.task('clear-dir', (done) => );
/*產出*/
gulp.task('img', function () );
/**靜態檔案(不需要編譯) */
gulp.task('assets', function () );
/**html處理 */
gulp.task('mini-html', function () ))
.pipe(gulp.dest(config.path.dist))
// 注入瀏覽器
.pipe(reload());
});/**less編譯 */
gulp.task('less', function () ))
.pipe(gulp.dest(config.path.dist + 'css/'))
// 注入瀏覽器
.pipe(reload())
);});/**es6轉es5 */
gulp.task('babel-js', function () ));
});/**開啟服務 */
gulp.task('server', function () ,
port:'8888', // 預設3000
});/**監聽 */
// gulp.watch(config.path.src + '**.html').on('change', reload);
gulp.watch(config.path.src + '**.html', gulp.series('mini-html'));
gulp.watch(config.path.src + 'js/**.js', gulp.series('babel-js'));
gulp.watch(config.path.src + 'less/**.less', gulp.series('less'));
});/**
* 開發：
* 開啟**伺服器，
* 監聽自動重新整理,
* es6轉換
* less編譯補全字首
*/gulp.task('default', gulp.series('clear-dir','assets','img','mini-html', 'less', 'babel-js', 'server', (done) => ));
/** * 生產:
* 合併，壓縮等操作...
*/
gulp常用外掛程式以及配置
下面是自己專案中用到的外掛程式和配置，大部分需要的功能都可以實現，在需要的時候複製貼上改改路徑，儲存下來以後用的到的時候可以找得到。關於gulp的教程網上有很多。推薦乙個詳細的教程 var gulp require gulp 本地安裝gulp所用到的地方 var fileinclude requir...
gulp常用方法
gulp常用方法有以下幾種 gulp.src 入口檔案路徑 gulp模組的src方法。用於產生資料流，它的引數表示所要處理的檔案，一般有以下幾種 此處的js也可換成css img等檔案。gulp.dest 用來寫入檔案 gulp模組的dest方法，可以用來傳遞檔案，同時寫入檔案到指定目錄。可以重複的...
gulp常用外掛程式
本人就職於一家網際網路小公司，根據自己的專案紀錄一下常用的gulp外掛程式，專案不是很大！文章目錄 1.gulp load plugins 2.yargs 3.del 4.gulp filter 5.gulp header 6.run sequence 7.gulp uglify 8.gulp mi...