Skip to content

Instantly share code, notes, and snippets.

@hendrysadrak
Last active April 24, 2016 18:33
Show Gist options
  • Save hendrysadrak/0fb9f608115e62e60f421ce363917fbc to your computer and use it in GitHub Desktop.
Save hendrysadrak/0fb9f608115e62e60f421ce363917fbc to your computer and use it in GitHub Desktop.
Codepen.io extract - gulp task
// # npm i --save-dev gulp gulp-sass gulp-sourcemaps gulp-babel babel-preset-es2015 browser-sync gulp-autoprefixer
'use strict';
var gulp = require('gulp'),
sass = require('gulp-sass'),
sourcemaps = require('gulp-sourcemaps'),
babel = require('gulp-babel'),
browserSync = require('browser-sync').create(),
autoprefixer = require('gulp-autoprefixer');
gulp.task('sass', function () {
return gulp.src('scss/*.scss')
.pipe(sourcemaps.init())
.pipe(sass().on('error', sass.logError))
.pipe(autoprefixer({
browsers: [ 'last 2 versions' ],
cascade: false
}))
.pipe(sourcemaps.write())
.pipe(gulp.dest('css/'))
.pipe(browserSync.stream());
});
gulp.task('babel', function () {
return gulp.src('babel/*.babel')
.pipe(sourcemaps.init())
.pipe(babel({
presets: [ 'es2015' ]
}))
.pipe(sourcemaps.write())
.pipe(gulp.dest('js/'))
});
gulp.task('browser-sync', function () {
browserSync.init({
server: {
baseDir: "./"
}
});
});
gulp.task('default', [ 'sass', 'babel', 'browser-sync' ], function () {
gulp.watch('scss/*.scss', [ 'sass' ]);
gulp.watch('babel/*.babel', [ 'babel' ]);
gulp.watch('*.html').on('change', browserSync.reload);
gulp.watch('js/*.js').on('change', browserSync.reload);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment