IMPORTANT: Per accedir als fitxer de subversion: http://acacha.org/svn (sense password). Poc a poc s'aniran migrant els enllaços. Encara però funciona el subversion de la farga però no se sap fins quan... (usuari: prova i la paraula de pas 123456)

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

Instal·lació

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/

Instal·lació de plugins

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:

Configuració

Fitxer Gulpfile.js

TODO

Exemple:

Exemples ús

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

Gulp i Browserify

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

Laravel 5 utilitza Gulp amb Laravel elixir

Plugins

Llibreria JavaScript per a parser / mangler / compressor / beautifier er NodeJS


Vegeu també

Enllaços externs