0 0
Read Time1 Minute, 11 Second

install node
install npm
install gulp

pindah ke folder project
ketik di terminal
npm init

nanti akan muncul package.json

install gulp global (skali aja)
ketik
npm install -g gulp

kalau udah, cek gulp version
gulp -v

jika oke,
langsung run gulp dependent
ketik
npm install —save-dev gulp

=== install required plugin ===
install nanti akan ada file2 di node_modules
cara install
ketik
npm install jshint gulp-jshint gulp-sass gulp-concat gulp-uglify gulp-rename –save-dev

====
bikin file gulpfile.js

file gulp.js
// Include gulp
var gulp = require('gulp');

// Include Our Plugins
var jshint = require('gulp-jshint');
var sass = require('gulp-sass');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');

// Lint Task
gulp.task('lint', function() { return gulp.src('js/*.js') .pipe(jshint()) .pipe(jshint.reporter('default')); });

// Compile Our Sass
gulp.task('sass', function() { return gulp.src('scss/*.scss') .pipe(sass()) .pipe(gulp.dest('dist/css')); });

// Concatenate & Minify JS
gulp.task('scripts', function() { return gulp.src('js/*.js') .pipe(concat('all.js')) .pipe(gulp.dest('dist')) .pipe(rename('all.min.js')) .pipe(uglify()) .pipe(gulp.dest('dist/js')); });

// Watch Files For Changes
gulp.task('watch', function() { gulp.watch('js/*.js', ['lint', 'scripts']); gulp.watch('scss/*.scss', ['sass']); }); // Default Task gulp.task('default', ['lint', 'sass', 'scripts', 'watch']);;

 

file ini untuk config2,
bisa copy paste aja langsung dari project yang udah2.

https://travismaynard.com/writing/getting-started-with-gulp

About Post Author

TahuBanyak

Happy
Happy
0 %
Sad
Sad
0 %
Excited
Excited
0 %
Sleepy
Sleepy
0 %
Angry
Angry
0 %
Surprise
Surprise
0 %
Previous post CSS GRID NOTES
Next post CSS Trik : Pemahaman tentang penggunaan nth-child pada css

Average Rating

5 Star
0%
4 Star
0%
3 Star
0%
2 Star
0%
1 Star
0%

Leave a Reply

Your email address will not be published. Required fields are marked *