Skip to content

Instantly share code, notes, and snippets.

@ml242
Last active August 29, 2015 14:14
Show Gist options
  • Save ml242/713de3477128089e4d71 to your computer and use it in GitHub Desktop.
Save ml242/713de3477128089e4d71 to your computer and use it in GitHub Desktop.
Getting started with Gulp
If you have OSX, install NVM https://github.com/creationix/nvm
Install and add zsh, bash, etc
// curl https://raw.githubusercontent.com/creationix/nvm/v0.23.2/install.sh | zshrc
add this line to ~/.zshrc to use NVM from the cli
// source ~/.nvm/nvm.sh
### optional line to install io or a distinct node version: nvm install iojs ###
install gulp
// npm install -g gulp
Go to your project directory and save these packages:
npm install --save-dev gulp gulp-util
concatjs
npm install --save-dev gulp-uglify gulp-concat
concat css
npm install --save-dev gulp-minify-css
### Make your gulpfile.js like you would any other node file and include the modules you need/want to use ###
Sample:
var gulp = require('gulp'),
gutil = require('gulp-util'),
uglify = require('gulp-uglify'),
concat = require('gulp-concat'),
minifyCSS = require('gulp-minify-css');
console.log('gulp running'); // sanity check
// define your task
gulp.task('minify-css', function () {
gulp.src('./apps/common/css/*.css')
.pipe(minifyCSS({keepBreaks:true}))
.pipe(gulp.dest('./apps/common/min-css/'));
});
gulp.task('js', function () {
gulp.src('./apps/common/js/*.js')
.pipe(uglify())
.pipe(concat('haven-all.js'))
.pipe(gulp.dest('./apps/common/js/'));
});
gulp.task('default', function(){ // run your tasks
gulp.run('minify-css');
gulp.run('js');
});
Type gulp from the command line. Doneso!
This list borrows the steps kindly laid out by Rey Bango at tuts+
http://code.tutsplus.com/tutorials/managing-your-build-tasks-with-gulpjs--net-36910
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment