iT邦幫忙

0

Gulp 壓縮優化程式碼(1) DAY88

  • 分享至 

  • xImage
  •  

這裡我們先介紹
gulp-clean-css(壓縮css) 與 gulp-uglify(壓縮js)

https://www.npmjs.com/package/gulp-clean-css

https://www.npmjs.com/package/gulp-uglify

npm install gulp-clean-css --save
npm install gulp-uglify --save

壓縮css
加入

 .pipe($.cleanCss())

加入結果

gulp.task('sass', function () {
    return gulp.src('./source/scss/**/*.scss')
    .pipe($.plumber())
    .pipe($.sourcemaps.init())
    .pipe($.sass().on('error', $.sass.logError))
    .pipe($.postcss([autoprefixer()]))
    .pipe($.cleanCss())
    .pipe($.sourcemaps.write('.'))
    .pipe(gulp.dest('./public/css'))
    .pipe(browserSync.stream())
});

壓縮 js
加入

  .pipe($.uglify())

若我們壓縮的時候
要把 console 移除
可加入參數

 .pipe($.uglify({
            compress:{
                drop_console: true
            }
        }))

有關參數設定
可參考
https://github.com/mishoo/UglifyJS#compress-options

那今天的介紹就到這裡
若有任何問題 或 內容有誤
都可以跟我說唷/images/emoticon/emoticon41.gif


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言