Skip to content

Instantly share code, notes, and snippets.

@isGabe
Last active August 29, 2015 13:57
Show Gist options
  • Save isGabe/9377911 to your computer and use it in GitHub Desktop.
Save isGabe/9377911 to your computer and use it in GitHub Desktop.
Gulp.js
// Include gulp & plugins
var gulp = require('gulp'),
jshint = require('gulp-jshint'),
sass = require('gulp-sass'),
autoprefixer = require('gulp-autoprefixer'),
concat = require('gulp-concat'),
uglify = require('gulp-uglify'),
imagemin = require('gulp-imagemin'),
svgmin = require('gulp-svgmin'),
rename = require('gulp-rename'),
notify = require('gulp-notify'),
cache = require('gulp-cache'),
plumber = require('gulp-plumber'),
livereload = require('gulp-livereload');
// Add all the gruntfile tasks to gulp
require('gulp-grunt')(gulp);
// Compile Sass with grunt-sass (Libsass)
gulp.task('styles', function () {
gulp.src('source/scss/style.scss')
.pipe(sass({
sourceComments: true
}))
.pipe(autoprefixer())
.pipe(gulp.dest('source/css'))
.pipe(livereload())
.pipe(notify({ message: 'Styles compiled' }))
});
// Grunticon - see Gruntfile.js
gulp.task('svgmin', function() {
return gulp.src('source/images/icons/svg/*.svg')
.pipe(svgmin({
plugins: [
{collapseGroups: false},
{removeTitle: false}
]
}))
.pipe(gulp.dest('source/images/icons/svg/min'));
});
gulp.task('grunticon', function() {
gulp.run('grunt-grunticon');
});
// Lint Task
// gulp.task('lint', function() {
// return gulp.src('source/js/src/**/*.js')
// .pipe(jshint())
// .pipe(jshint.reporter('default'));
// });
// Concatenate & Minify JS
gulp.task('scripts', function() {
return gulp.src('source/js/site-scripts/*.js')
.pipe(concat('scripts.js'))
// .pipe(livereload())
// .pipe(rename('scripts.min.js'))
// .pipe(uglify())
.pipe(gulp.dest('source/js'))
.pipe(notify({ message: 'Scripts compiled' }))
});
gulp.task('watch', function() {
livereload.listen();
gulp.watch('public/css/style.css').on('change', livereload.changed);
// Watch .scss files
gulp.watch('source/scss/**/*.scss', ['styles']);
// Watch .js files
gulp.watch('source/js/site-scripts/**/*.js', ['scripts']);
// Watch SVG icons for Grunticon
gulp.watch('source/images/icons/svg/*.svg', ['svg']);
// Watch image files
// gulp.watch('src/images/**/*', ['images']);
});
// gulp.task('images', function() {
// return gulp.src('source/images/**/*')
// .pipe(cache(imagemin({ optimizationLevel: 5, progressive: true, interlaced: true })))
// .pipe(gulp.dest('source/images'))
// .pipe(notify({ message: 'Images task complete' }));
// });
// Default Task
gulp.task('svg', ['svgmin', 'grunticon']);
gulp.task('default', ['styles', 'scripts', 'svg', 'watch']);
{
"name": "Gulpy McGulperton",
"version": "0.1.0",
"description": "A working example of gulp.js",
"author": "Gabriel Luethje",
"devDependencies": {
"grunt": "^0.4.5",
"grunt-grunticon": "^2.1.1",
"gulp": "^3.8.10",
"gulp-autoprefixer": "2.1.0",
"gulp-cache": "^0.2.4",
"gulp-compass": "^2.0.3",
"gulp-concat": "^2.4.3",
"gulp-filter": "^2.0.0",
"gulp-grunt": "^0.5.2",
"gulp-imagemin": "^2.1.0",
"gulp-jshint": "^1.9.2",
"gulp-livereload": "^3.7.0",
"gulp-notify": "^2.2.0",
"gulp-plumber": "^0.6.6",
"gulp-rename": "^1.2.0",
"gulp-ruby-sass": "^1.0.0-alpha",
"gulp-sass": "^1.3.3",
"gulp-svgmin": "^1.1.1",
"gulp-uglify": "^1.1.0",
"npm-check-updates": "^1.5.1"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment