Skip to content

Instantly share code, notes, and snippets.

@ninjasort
Last active September 1, 2019 20:43
Show Gist options
  • Save ninjasort/6501a5124a568b31b9b3 to your computer and use it in GitHub Desktop.
Save ninjasort/6501a5124a568b31b9b3 to your computer and use it in GitHub Desktop.
Gulp Workflow - Sass, Uglify, Express, Copy, Bourbon, Neat, BrowserSync
var gulp = require('gulp'),
gutil = require('gulp-util'),
uglify = require('gulp-uglify'),
header = require('gulp-header'),
filter = require('gulp-filter'),
concat = require('gulp-concat'),
browserSync = require('browser-sync'),
sass = require('gulp-sass'),
bodyParser = require('body-parser'),
express = require('express'),
livereload = require('gulp-livereload'),
lr = require('tiny-lr')
server = lr();
var jsSrc = [
'src/js/*.js'
],
sassSrc = [
'src/styles/sass/*.scss'
];
// Static server
gulp.task('browser-sync', function() {
browserSync({
server: {
baseDir: "./"
}
});
});
gulp.task('js', function () {
gulp.src(jsSrc)
.pipe(uglify())
.pipe(concat('output.min.js'))
.pipe(gulp.dest('dist/js'));
});
gulp.task('sass', function () {
gulp.src(sassSrc)
.pipe(sass({
style: 'expanded',
lineNumbers: true,
sourcemap: false,
includePaths: [require('node-neat').includePaths, require('node-bourbon').includePaths]
}))
.pipe(concat('style.css'))
.pipe(gulp.dest('dist/css'))
.pipe(livereload());
});
gulp.task('copy', function () {
gulp.src('./src/assets/**/*')
.pipe(gulp.dest('dist/assets'));
});
gulp.task('server', function () {
app = express();
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(bodyParser.json());
app.use(express.static(__dirname));
app.listen(4000);
});
// Watches
gulp.task('watch', function () {
var server = livereload();
gulp.watch(jsSrc, ['js']);
gulp.watch(coffeeSrc, ['coffee']);
gulp.watch(sassSrc, ['sass']);
gulp.watch(['dist/js/*.js', 'dist/css/*.css', '*.html'], function (e) {
server.changed(e.path);
});
});
gulp.task('default', [
'server',
'copy',
'sass',
'js',
'watch'
]);
{
"name": "",
"version": "0.1.0",
"description": "",
"main": "",
"dependencies": {},
"devDependencies": {
"body-parser": "^1.7.0",
"express": "^4.8.8",
"gulp": "^3.8.7",
"gulp-concat": "^2.3.4",
"gulp-connect": "^2.0.6",
"gulp-livereload": "^2.1.1",
"gulp-sass": "^0.7.3",
"gulp-uglify": "^1.0.1",
"gulp-header": "latest",
"gulp-filter": "latest",
"gulp-util": "^3.0.1",
"node-bourbon": "^1.2.3",
"node-neat": "^1.3.0",
"tiny-lr": "^0.1.1",
"browser-sync": ""
},
"scripts": {
"start": "gulp"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment