GULP.JS.md

First project with gulp

1. Install gulp globally:

$ npm install --global gulp

2. Install gulp in your project devDependencies:

$ npm install --save-dev gulp

3. place the files gulpfile.js and package.json in your project root.

4. Run gulp:

# for start default task, which runs the watch task
gulp

# starts the watch task
gulp watch

# build css from less files
gulp buildCSS

# build js files from resource folder
gulp buildJs

# build js and css files
gulp build

gulpfile.js

var gulp = require('gulp'),
    uglify = require('gulp-uglify'),
    jshint = require('gulp-jshint'),
    less = require('gulp-less')
    minifyCSS = require('gulp-minify-css');

/**
 * default task
 */
gulp.task('default', ['watch']);

/**
 * watcher task
 */
gulp.task('watch', function() {
	gulp.watch('resources/assets/less/**/*.less', ['buildCSS']);
	gulp.watch('resources/js/app/**/*.js', ['buildJs']);
});

/**
 * build CSS
 */
gulp.task('buildCSS', function() {
	gulp.src('resources/assets/less/app.less')
		.pipe(less())
		.pipe(minifyCSS())
		.pipe(gulp.dest('public/css'));
});

/**
 * build JS for Widget
 */
gulp.task('buildJs', function() {
	gulp.src('resources/js/app/**/*.js')
		.pipe(jshint())
		.pipe(jshint.reporter('default'))
		.pipe(uglify())
		.pipe(gulp.dest('public/js/app'));
});

/**
 * build all, CSS & JS
 */
gulp.task('build', ['builCSS', 'buildJs']);

package.json

{
  "devDependencies": {
    "gulp": "^3.8.8",
    "gulp-jshint": "^1.9.2",
    "gulp-replace": "^0.5.3",
    "gulp-uglify": "^1.1.0",
    "gulp-less": "*",
    "gulp-minify-css": "*",
    "gulp-watch": "*"
  }
}