Skip to content

Instantly share code, notes, and snippets.

@gustavoquinalha
Created January 31, 2018 19:17
Show Gist options
  • Save gustavoquinalha/a6e142eb750cbc08d56a0d2b49e878c8 to your computer and use it in GitHub Desktop.
Save gustavoquinalha/a6e142eb750cbc08d56a0d2b49e878c8 to your computer and use it in GitHub Desktop.
Gulp SCSS
var gulp = require('gulp');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');
var sourcemaps = require('gulp-sourcemaps');
var browserSync = require('browser-sync').create();
var rename = require("gulp-rename");
var cleanCSS = require('gulp-clean-css');
var input = './assets/css/sass/main.scss';
var output = './assets/css';
var sassOptions = {
errLogToConsole: true,
outputStyle: 'expanded'
};
var autoprefixerOptions = {
browsers: ['last 2 versions', '> 5%', 'Firefox ESR']
};
gulp.task('serve', ['sass'], function() {
browserSync.init({
server: {
baseDir: "./"
}
});
gulp.watch("assets/css/sass/**/*.scss", ['sass']);
gulp.watch("*.html").on('change', browserSync.reload);
});
gulp.task('sass', function() {
return gulp
.src(input)
.pipe(sourcemaps.init())
.pipe(sass(sassOptions).on('error', sass.logError))
.pipe(sourcemaps.write())
.pipe(autoprefixer(autoprefixerOptions))
.pipe(cleanCSS({compatibility: 'ie8'}))
.pipe(rename("style.min.css"))
.pipe(gulp.dest(output))
.pipe(browserSync.stream());
});
gulp.task('watch', function() {
return gulp
// Watch the input folder for change,
// and run `sass` task when something happens
.watch(input, ['sass'])
// When there is a change,
// log a message in the console
.on('change', function(event) {
console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
});
});
gulp.task('default', ['serve']);
gulp.task('prod', function () {
return gulp
.src(input)
.pipe(sass({ outputStyle: 'compressed' }))
.pipe(autoprefixer(autoprefixerOptions))
.pipe(gulp.dest(output));
});
{
"name": "konf-landing-page",
"version": "1.0.0",
"description": "",
"main": "gulpfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "gulp"
},
"repository": {
"type": "git",
"url": "git+https://github.com/gustavoquinalha/konf-landing-page.git"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/gustavoquinalha/konf-landing-page/issues"
},
"homepage": "https://github.com/gustavoquinalha/konf-landing-page#readme",
"dependencies": {
"gulp-sass": "^2.3.2"
},
"devDependencies": {
"breakpoint-sass": "^2.7.0",
"browser-sync": "^2.18.2",
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.1",
"gulp-clean-css": "^3.9.2",
"gulp-rename": "^1.2.2",
"gulp-sass": "^2.3.2",
"gulp-sourcemaps": "^2.2.0"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment