Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Gulpfile for AngularJS projects

Gulpfile - The Configuration

In this file we fire up all the necessary Gulp plugins needed for running this application. As you may have noticed, it uses the Literate Coffeescript format, so there is no need to do classic code comments. Just write it as Markdown and indent whenever you need to run some code.

Initialization

gulp        = require 'gulp'
run         = require('gulp-load-plugins')()
sync 		= require 'browser-sync'
reload      = sync.reload

Paths

paths =
  slim 		 : ['resources/**/*.slim']
  templates  : ['app/**/*.slim']
  sass 		 : ['resources/assets/sass/**/*.scss']
  coffee 	 : ['app/App.litcoffee',
  				'app/**/*.modules.litcoffee',
  				'app/**/*.services.litcoffee',
  				'app/**/*.directives.litcoffee',
  				'app/**/*.controllers.litcoffee',
  				'app/**/*.litcoffee'	  								
  				]

Tasks

gulp.task 'serve', () ->
  sync.init null,
    notify : false
    server :
      baseDir : './dist/'

gulp.task 'slim', ->
  gulp.src paths.slim
  .pipe run.plumber()
  .pipe run.slim pretty : true, options: "attr_delims={'(' => ')', '[' => ']'}"
  .pipe gulp.dest 'dist/'
  .pipe run.notify message : 'Slim compiled and minified!'
  .pipe reload stream : true

gulp.task 'templates', ->
  gulp.src paths.templates
  .pipe run.plumber()
  .pipe run.slim pretty : true, options: "attr_delims={'(' => ')', '[' => ']'}"
  .pipe gulp.dest 'dist/views/templates/'
  .pipe run.notify message : 'Directive templates compiled and minified!'
  .pipe reload stream : true

gulp.task 'sass', ->
  gulp.src paths.sass
  .pipe run.plumber()
  .pipe run.rubySass sourcemap : false, style : 'compressed', noCache : true
  .pipe run.autoprefixer 'last 2 version', 'safari 5', 'ie 9', 'ios 6', 'android 4'
  .pipe run.rename { suffix : '.min' }
  .pipe run.minifyCss()
  .pipe run.filesize()
  .pipe gulp.dest 'dist/assets/css/'
  .pipe run.notify message : 'Sass compiled and minified!'
  .pipe reload stream : true

gulp.task 'coffee', ->
  gulp.src paths.coffee
  .pipe run.plumber()
  .pipe run.coffee bare : true
  .pipe run.concat( 'app.min.js' )
  .pipe run.uglify mangle : false 
  .pipe run.filesize()
  .pipe gulp.dest 'dist/assets/js/'
  .pipe run.notify message : 'Coffeescript compiled and minified!'
  .pipe reload stream : true, once : true

gulp.task 'default', [ 'slim', 'templates', 'sass', 'coffee', 'serve' ], () ->
  gulp.watch paths.slim, 		['slim', reload]
  gulp.watch paths.templates, 	['templates', reload]
  gulp.watch paths.sass, 		['sass', reload]
  gulp.watch paths.coffee, 		['coffee', reload]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment