技術標籤：NodeJsjavascriptjsnode.js

使用gulp-uglify壓縮javascript檔案，可以減小檔案大小。有時需要完全壓縮去除全部註釋，有時則需要保留部分，具體如下詳述：

1.安裝gulp-uglify

gith地址：https://github.com/terinjokes/gulp-uglify

2.基本使用

var gulp = require('gulp'),
    uglify = require('gulp-uglify');

gulp.task('uglifyJs', function(){
    gulp.src('assets/js/*.js')
    .pipe(uglify())
    .pipe(gulp.dest('dist/js'));
}); 
 

3.常用引數

gulp.task('uglifyJs', function(){
    gulp.src('assets/js/*.js')
    .pipe(uglify({
        mangle: true,        //型別：Boolean 預設：true， 是否修改變數名
        compress: true,      //型別：Boolean 預設：true， 是否完全壓縮
    }))
    .pipe(gulp.dest('dist/js'));
}); 

4.去除全部註釋

gulp.task('uglifyJs', function(){
    gulp.src('assets/js/*.js')
    .pipe(uglify({
        output: {
            comments: true,        //型別：Boolean 預設：true， 是否保留註釋
        }
    }))
    .pipe(gulp.dest('dist/js'));
}); 
 

5.通過indexOf判斷保留部分註釋

gulp.task('uglifyJs', function(){
    gulp.src('assets/js/*.js')
    .pipe(uglify({
        output: {
            comments: function(node, comment){
                //含有@date字元 部分的註釋進行保留
                return comment.value.indexOf("@date")>=0;
            }    
        }
        
    }))
    .pipe(gulp.dest('dist/js'));
}); 


//例如：
/**
 * @date 2020-12-30
 * 描述內容...
 */
 

6.通過正則判斷保留部分註釋

gulp.task('uglifyJs', function(){
    gulp.src('assets/js/*.js')
    .pipe(uglify({
        output: {
            comments: function(node, comment){
                //以!號開頭 部分的註釋進行保留
                return /^!/.test(comment.value);
            }
        }
    }))
    .pipe(gulp.dest('dist/js'));
}); 

//例如：
/*!
 * 描述內容...
 */

7.統一新增公共註釋

gulp.task('uglifyJs', function(){
    gulp.src('assets/js/*.js')
    .pipe(uglify({
        output: {
            preamble: "/** \r\n 版本所有 \r\n 填寫日期 \r\n 填寫作者資訊 */"
        }
    }))
    .pipe(gulp.dest('dist/js'));
});