Otomatisasi dengan gulp.js

Mengecilkan file CSS dan JS

Plugin

Struktur Folder

proyek/
|-- original/
|   |-- style.css
|   |-- script.js
|-- dist/
|   |-- style.css
|   |-- script.js
|-- gulpfile.js

Gulpfile.js

var gulp        = require('gulp');
var minifyCss   = require('gulp-minify-css');
var uglify      = require('gulp-uglify');

// Kecilkan ukuran CSS
gulp.task('css', function() {
    // Baca `style.css` dari folder `original`
    return gulp.src('original/style.css')
        // Menggunakan plugin `gulp-minify-css`
        .pipe(minifyCss())
        // Tulis `style.css` ke folder `dist`
        .pipe(gulp.dest('dist'));
});

// Kecilkan ukuran JS
gulp.task('js', function() {
    // Baca `script.js` dari folder `original`
    return gulp.src('original/script.js')
        // Menggunakan plugin `gulp-uglify`
        .pipe(uglify())
        // Tulis `script.js` ke folder `dist`
        .pipe(gulp.dest('dist'));
});

// Lakukan semua tugas
gulp.task('default', ['css', 'js']);