var {src, dest, watch} = require('gulp');
var browserSync = require('browser-sync').create();
var sass = require('gulp-sass');
// Static server
function bs() {
serveSass();
browserSync.init({
server: {
baseDir: "./"
}
});
watch("./*.html").on('change', browserSync.reload);
watch("./scss/**/*.scss", serveSass);
watch("./js/*.js").on('change', browserSync.reload);
};
// Compile sass into CSS & auto-inject into browsers
function serveSass() {
return src("./scss/*.scss")
.pipe(sass())
.pipe(dest("./css"))
.pipe(browserSync.stream());
};
exports.serve = bs;
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter