gulp打包js

在終端定位到你要建立目錄的地方，輸入

sudo mkdir js

建立文件夾，這個文件夾就是放你要壓縮js文件的地方

輸入

sudo vim gulpfile.js

這個js就是寫gulp全部的配置信息，

在這個js中輸入：

var gulp=require ("gulp") //獲取gulp

var uglify=require ("gulp-uglify") //獲取gulp-ublify組建

gulp.task("script", function(){
    gulp.src("js/*.js") //找到js文件夾下的全部js
           .pipe(uglify()) //壓縮文件
           .pipe(gulp.dest("dist/js")) //壓縮完成後的文件另存到dist/js/目錄下 
})  

gulp.task(name, fn) - 定義任務，第一個參數是任務名，第二個參數是任務內容。 gulp.src(path) - 選擇文件，傳入參數是文件路徑。 gulp.dest(path) - 輸出文件 gulp.pipe() - 管道，你能夠暫時將 pipe 理解爲將操做加入執行隊列 

此時你還須要安裝一個局域的gulp(我沒安裝各類報錯)

在gulplify.js的平級下打開終端，輸入

sudo cnpm install gulp      //此處不須要 「-g」

而後安裝gulp-uglify模板，命令以下：

sudo cnpm install gulp-uglify

輸出若是沒有扎眼的紅色提示則表示安裝成功

這時輸入

gulp script

若是輸出中有Finished "script" after ...即表示壓縮成功

這時你去文件夾目錄下便能看到一個叫dist的文件夾，這個文件夾下的js文件就是壓縮成功後的代碼

固然這樣若是js下的文件有變化就須要本身從新輸入一遍gulp script，不是很人性化
因此加入一條自動檢測代碼：

gulp.task('auto', function () {
    // 監聽文件修改，當文件被修改則執行 script 任務
    gulp.watch('js/*.js', ['script'])
})

固然watch跑起來就進入運行狀態，此時你不能再輸入別的操做，固然想要輸入別的命令則須要關閉watch便可，命令：

ctrl+C（Mac爲Control +C）

固然咱們也能夠把它定義成默認事件，只須要在終端輸入gulp而後回車即可讓程序運行，代碼以下：

gulp.task('default', ['script', 'auto']);

最終版代碼：

var gulp = require ("gulp")

var uglify = require("gulp-uglify")

gulp.task("script", function(){
    gulp.src("js/*.js").pipe(uglify()).pipe(gulp.dest("dist/js"))
})
gulp.task("auto",function(){
    gulp.watch("js/*js",["script"])
})
gulp.task("default",["script","auto"])