Skip to content

Instantly share code, notes, and snippets.

@john-eevee
Created May 20, 2017 14:39
Show Gist options
  • Select an option

  • Save john-eevee/464851796c53d9afcd8e84fd894ce7d4 to your computer and use it in GitHub Desktop.

Select an option

Save john-eevee/464851796c53d9afcd8e84fd894ce7d4 to your computer and use it in GitHub Desktop.
Gulp with Sass Browsersync & Pug
const gulp = require('gulp');
const sass = require('gulp-sass');
const autoprefixer = require('gulp-autoprefixer');
const pug = require('gulp-pug');
const browserSync = require('browser-sync').create();
const gutil = require('gulp-util');
gulp.task('sass', function () {
return gulp.src('sass/**/*.scss')
.pipe(sass({ style: 'expanded', sourceComments: 'map', errLogToConsole: true }))
.pipe(autoprefixer('last 2 version', "> 1%", 'ie 8', 'ie 9'))
.pipe(gulp.dest('dist/css'))
.on('error', gutil.log)
.pipe(browserSync.stream());
});
gulp.task('views', function buildHTML() {
return gulp.src('views/**/*.pug')
.pipe(pug({
// Your options in here.
}))
.pipe(gulp.dest('dist'))
.on('error', gutil.log)
.pipe(browserSync.stream())
});
gulp.task('serve', ['sass', 'views'], function () {
browserSync.init({
server: "./dist"
});
gulp.watch("sass/**/*.scss", ['sass']);
gulp.watch("views/**/*.pug", ['views']);
gulp.watch("dist/**/*.html").on('change', browserSync.reload);
})
gulp.task('build', ['sass', 'views'], () => console.log("building..."));
@lucianobarauna
Copy link

lucianobarauna commented Jul 21, 2017

Belas taks ;-)
Eu estava fazendo exatamente assim quando encontrei seu gits !
Parabéns

@eliud-c-delgado
Copy link

Muito obrigado pela configuração o gulpfile

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment