Gulp Sample

gulpfile.coffee

gulp = require 'gulp'
sourcemaps = require 'gulp-sourcemaps'
source = require 'vinyl-source-stream'
buffer = require 'vinyl-buffer'
browserify = require 'browserify'
watchify = require 'watchify'
uglify = require 'gulp-uglify'
babel = require 'babelify'
livereload = require 'gulp-livereload'
sass = require 'gulp-sass'

gulp.task 'build:js', ->
  compileJS()

gulp.task 'build:css', ->
  compileCSS()

gulp.task 'build', ['build:js', 'build:css']

gulp.task 'watch', ->
  livereload.listen()
  compileJS(true)
  gulp.watch('./css/**/*.sass', ['watch'])

gulp.task 'default', ['watch']


compileJS = (watch) ->
  bundler = watchify(browserify('./js/App.jsx', { debug: true }).transform(
    babel.configure({
      stage: 1
    })
  ))

  rebundle = ->
    bundler.bundle()
      .on 'error', (err) -> console.error(err); this.emit('end')
      .pipe source('bundle.min.js')
      .pipe buffer()
      .pipe sourcemaps.init(loadMaps: true)
      .pipe uglify()
      .pipe sourcemaps.write('./')
      .pipe gulp.dest('./static')
      .pipe livereload()

  if watch
    bundler.on 'update', ->
      console.log('-> bundling...')
      rebundle()

  rebundle()

compileCSS = ->
  gulp.src './css/**/*.sass'
    .pipe sourcemaps.init()
    .pipe sass(outputStyle: 'compressed')
    .pipe sourcemaps.write('./')
    .pipe gulp.dest('./static')
    .pipe livereload()

package.json

{
  "name": "web",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Yamitzky<[email protected]>",
  "license": "UNLICENSED",
  "devDependencies": {
    "alt": "^0.17.4",
    "babelify": "^6.3.0",
    "browserify": "^11.2.0",
    "coffee-script": "^1.10.0",
    "fixed-data-table": "^0.4.7",
    "gulp": "^3.9.0",
    "gulp-livereload": "^3.8.1",
    "gulp-sass": "^2.0.4",
    "gulp-sourcemaps": "^1.6.0",
    "gulp-uglify": "^1.4.2",
    "gulp-util": "^3.0.6",
    "lodash.assign": "^3.2.0",
    "react": "^0.14.0",
    "react-dom": "^0.14.0",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.1.0",
    "watchify": "^3.4.0"
  }
}