http://justinjohnson.org/javascript/getting-started-with-gulp-and-browserify/
Gulp.js és un build system (sistema de construcció) que permet automatitzar tasques comuns en desenvolupament d'aplicacions, com per exemple la minificació de codi Javascript, la recarrega del navegador, compressió d'imatges, validació de sintaxis de codi, etc.
Gulp utilitza Javascript funciona amb Node.js i és Open Source (https://github.com/gulpjs/gulp)
En altres llenguatges de programació com Java o C és més habitual l'ús d'aquests tipus d'eines (vegeu make, Ant, Maven, Gradle, etc.). Gulp però està específicament pensat per a Javascript i per a les tasques més habituals d'un projecte Javascript
Primer cal instal·lar node.js i tenir npm correctament instal·lat/configurat. Aleshores podeu instal·lar gulp amb:
$ sudo npm install --global gulp
Tindreu gulp instal·lat a globalment:
/usr/local/bin/gulp -> /usr/local/lib/node_modules/gulp/bin/gulp.js
NOTA: Vom podeu veure el path és /usr/local/ i per tant hem instal·lat node manualment i no utilitzant el paquet Debian
Per una instal·lació local de gulp
$ npm install gulp
I s'instal·larà a la carpeta a la que esteu amb el path relatiu:
node_modules/gulp/
Es pot fer amb:
$ npm install gulp NOM_DEL_PLUGIN
Per exemple:
$ npm install gulp gulp-phpspec gulp-notify gulp-run --save-dev
per instal·lar els plugins gulp-phpspec, gulp-notify i gulp-run
I s'instal·laran el mòduls a:
$ ls node_modules/ gulp gulp-notify gulp-phpspec gulp-run
Recursos:
TODO
Exemple:
Podeu consultar si el teniu instal·lat i quina versió està instal·lada amb:
$ gulp -v [11:46:31] CLI version 3.8.11 [11:46:31] Local version 3.8.11
Existeix un plugin anomenat gulp-browserify ([1]).
Un exemple:
var browserify = require('gulp-browserify'); var gulp = require('gulp'); var gutil = require('gulp-util'); var rename = require('gulp-rename'); gulp.task('browserify', function() { var production = gutil.env.type === 'production'; gulp.src(['index.js'], {read: false}) // Browserify, and add source maps if this isn't a production build .pipe(browserify({ debug: !production, transform: ['reactify'], extensions: ['.jsx'] })) .on('prebundle', function(bundler) { // Make React available externally for dev tools bundler.require('react'); }) // Rename the destination file .pipe(rename('bundle.js')) // Output to the build directory .pipe(gulp.dest('build/')); });
Resources:
Laravel 5 utilitza Gulp amb Laravel elixir
Llibreria JavaScript per a parser / mangler / compressor / beautifier er NodeJS