Pensei em compartilhar meu modelo inicial simples para gulpjs . O modelo é usado para concat e minificar arquivos js e css, remover todas as instruções console.log e armazenar os arquivos de construção em meu diretório de construção.
Já que ainda sou muito novo no mundo do gulp, adoraria ouvir dicas / informações úteis que alguns de vocês, profissionais, possam ter aprendido ao longo do caminho.
var gulp = require('gulp');
var uglify = require('gulp-uglify');
var clean = require('gulp-clean');
var concat = require('gulp-concat');
var striplog = require('gulp-strip-debug');
var minfycss = require('gulp-minify-css');
var gutil = require('gulp-util');
// My js files
gulp.task('scripts', function() {
var js_src = 'assets/js/**/*.js';
var js_dest = 'assets/build/js';
// pipe the js through concat, console log stripping, uglification and then store
return gulp.src(js_src)
.pipe(concat('app.min.js')) // concat all files in the src
.pipe(striplog())
.pipe(uglify()) // uglify them all
.pipe(gulp.dest(js_dest)) // save the file
.on('error', gutil.log);
});
// My css files
gulp.task('css', function() {
var css_src = 'assets/css/**/*.css';
var css_dest = 'assets/build/css';
// Concat and minify all the css
return gulp.src(css_src)
.pipe(concat('app.min.css')) // concat all files in the src
.pipe(minfycss()) // uglify them all
.pipe(gulp.dest(css_dest)) // save the file
.on('error', gutil.log);
});
// Clean all builds
gulp.task('clean', function() {
return gulp.src(['assets/build/'], {read: false})
.pipe(clean());
});
// Default task - clean the build dir
// Then rebuild the js and css files
gulp.task('default', ['clean'], function() {
gulp.start('css', 'scripts');
});
Se você estiver usando o gruntjs para tarefas relativamente triviais como essa, recomendo fortemente que você experimente o gulp, pois achei que ele é muito rápido e fácil de configurar.
Se você estiver totalmente perdido, recomendo dar uma olhada no artigo de Mark Goodyear sobre como começar a usar gulpjs .