最近在調(diào)試項(xiàng)目時(shí), 發(fā)現(xiàn)gulp-uglify原來的使用方式會(huì)報(bào)錯(cuò), 因此在這里特別說明一下新版本的使用教程.
本篇博客的最后修訂時(shí)間為2017/6/14.
pump
使用不了最新版本的gulp-uglify, 主要是因?yàn)檫@個(gè)pump, 之前的版本一直是使用pipe( ), 先簡(jiǎn)單介紹一下pump.
pump簡(jiǎn)介
pump是一個(gè)小節(jié)點(diǎn)模塊,將流連接在一起捞高,如果其中一個(gè)關(guān)閉,則會(huì)將它們?nèi)科茐南撬铡.?dāng)dest發(fā)出關(guān)閉或錯(cuò)誤時(shí)双絮,使用標(biāo)準(zhǔn)source.pipe(dest)事件源將不會(huì)被銷毀。 您還不能提供回調(diào)來告訴管道何時(shí)完成螃概。
為什么我們使用pump
當(dāng)使用Node.js流中的管道時(shí)嘀倒,錯(cuò)誤不會(huì)通過管道流傳播屈留,如果目標(biāo)流關(guān)閉,則源流不會(huì)關(guān)閉测蘑。 泵模塊將這些問題規(guī)范化灌危,并在回調(diào)中傳遞錯(cuò)誤。
總結(jié)
...其實(shí)說白了就是pump可以使我們更容易找到代碼出錯(cuò)位置.
當(dāng)我們使用pipe出錯(cuò)時(shí)可能會(huì)提示
而使用了pump會(huì)提示
使用教程
前期安裝gulp我就不再多講, 本篇博客只敘述壓縮插件的使用, 不會(huì)安裝的可以查看我的這篇博客:
前端構(gòu)建工具gulp超詳細(xì)配置, 使用教程(圖文)
1. 安裝pump
//git輸入指令
npm install pump
2. 安裝壓縮js插件
npm install --save-dev gulp-uglify
3. 配置文件
//轉(zhuǎn)換js并壓縮文件
var gulp = require('gulp');
var uglify = require('gulp-uglify');
var pump = require('pump');
var babel = require('gulp-babel');
gulp.task('js', function(cb){
pump([
gulp.src('./src/js/*.js'),
babel({presets: ['es2015']}),
//2017年6月14日測(cè)試, 發(fā)現(xiàn)使用es6的let語(yǔ)句定義變量會(huì)發(fā)生錯(cuò)誤, 如果發(fā)生錯(cuò)誤把第4步的gulp-babel兩個(gè)插件安上, 并寫上上面的語(yǔ)句
uglify(),//壓縮操作
gulp.dest('./dist/js')
],
cb//函數(shù)有參數(shù)
);
});
4. es6轉(zhuǎn)es5gulp-babel
插件
npm install --save-dev gulp-babel
npm install --save-dev babel-preset-es2015 //es6轉(zhuǎn)es5