Skip to content

Instantly share code, notes, and snippets.

@nmaxcom
Created November 12, 2015 20:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nmaxcom/f029442911339ecc3b55 to your computer and use it in GitHub Desktop.
Save nmaxcom/f029442911339ecc3b55 to your computer and use it in GitHub Desktop.
The one that I use for now, always in constant change... (about to add PostCSS)
var autoprefixer = require('gulp-autoprefixer');
var browserSync = require('browser-sync');
var concat = require('gulp-concat');
var del = require('del');
var gulp = require('gulp');
var htmlmin = require('gulp-htmlmin');
var kit = require('gulp-kit');
var merge = require('merge-stream');
var minifycss = require('gulp-minify-css');
var nano = require('gulp-cssnano');
var newer = require('gulp-newer');
var plumber = require('gulp-plumber');
var pngquant = require('imagemin-pngquant');
var postcss = require('gulp-postcss');
var rename = require('gulp-rename');
var runSequence = require('run-sequence');
var sass = require('gulp-sass');
var sourcemaps = require('gulp-sourcemaps');
var uglify = require('gulp-uglify');
var uncss = require('gulp-uncss');
var SRC = 'src/';
var DST = 'dst/';
/****************************************************/
// Ejecutar "npm install" para instalar dependencias
// y luego ejecutar "gulp build" para ejecutar todas
// las tasks que volcan en la carpeta DST
/****************************************************/
gulp.task('build', function(callback) {
runSequence('clean', ['images', 'scripts', 'fonts', 'favicon', 'robots', 'htaccess', 'sitemap', 'htmlkit'],
'htmlmin', 'sass', callback);
});
/****************************************************/
/****************************************************/
//
// DEV MODE
//
// Watch para desarrollar con actualización de cambios en sass y html
// 28 Oct: no se si els js s'estan copian bé. He de cridar a totes les funcions, com faig a 'build'?
/****************************************************/
gulp.task('watch', ['watch-sass'], function() {
browserSync.init({
server: DST
});
gulp.watch(SRC + '**/*.kit', ['watch-kit']);
gulp.watch(SRC + 'css/**/*.scss', ['watch-sass']);
gulp.watch(SRC + 'js/**/*.js', ['watch-scripts']);
gulp.watch(SRC + 'img/*', ['watch-img']);
gulp.watch(DST + "*.html").on('change', browserSync.reload);
});
gulp.task('watch-sass', function() {
return merge(
gulp.src(SRC + 'css/estilos.scss')
.pipe(sass())
.pipe(uncss({
html: [DST + '*.html']
})),
gulp.src(SRC + 'css/looper.scss')
.pipe(sass()),
gulp.src(SRC + 'css/tooltip.scss')
.pipe(sass()),
gulp.src(SRC + 'css/acordeon.scss')
.pipe(sass())
)
.pipe(autoprefixer())
.pipe(concat('estilos.css'))
.pipe(nano())
.pipe(gulp.dest(DST + 'css/'))
.pipe(gulp.dest(DST + 'css/'))
.pipe(browserSync.stream());
});
gulp.task('watch-kit', function() {
return gulp.src(SRC + '**/*.kit')
.pipe(kit({
compilePartials: true
}))
.pipe(gulp.dest(DST + ''));
});
gulp.task('watch-scripts', function() {
return gulp.src(SRC + 'js/**/*.js')
.pipe(plumber({
errorHandler: function(error) {
console.log(error.message);
this.emit('end');
}
}))
.pipe(concat('main.js'))
.pipe(uglify())
.pipe(gulp.dest(DST + 'js/'))
.pipe(browserSync.reload({
stream: true
}));
});
gulp.task('watch-img', function() {
return gulp.src(SRC + 'img/**/*')
.pipe(newer(DST + 'img/'))
.pipe(pngquant({
quality: '60',
})())
.pipe(gulp.dest(DST + 'img/'))
.pipe(browserSync.stream());
});
/****************************************************/
/****************************************************/
gulp.task('clean', function() {
return del([DST]);
});
gulp.task('images', function() {
return gulp.src(SRC + 'img/**/*')
.pipe(pngquant({
quality: '30',
})())
.pipe(gulp.dest(DST + 'img/'));
});
gulp.task('scripts', function() {
return gulp.src(SRC + 'js/**/*.js')
.pipe(plumber({
errorHandler: function(error) {
console.log(error.message);
this.emit('end');
}
}))
.pipe(concat('main.js'))
.pipe(uglify())
.pipe(gulp.dest(DST + 'js/'));
});
gulp.task('fonts', function() {
return gulp.src(SRC + 'fonts/**/*.{ttf,woff,woff2,eof,svg}')
.pipe(gulp.dest(DST + 'fonts/'));
});
gulp.task('favicon', function() {
return gulp.src(SRC + 'favicon.ico')
.pipe(gulp.dest(DST));
});
gulp.task('htaccess', function() {
return gulp.src(SRC + '.htaccess')
.pipe(gulp.dest(DST));
});
gulp.task('robots', function() {
return gulp.src(SRC + 'robots.txt')
.pipe(gulp.dest(DST));
});
gulp.task('sitemap', function() {
return gulp.src(SRC + 'sitemap.xml')
.pipe(gulp.dest(DST));
});
gulp.task('htmlkit', function() {
return gulp.src(SRC + '*.kit')
.pipe(kit({
compilePartials: true
}))
.pipe(gulp.dest(DST + ''));
});
gulp.task('htmlmin', function() {
return gulp.src(DST + '*.html')
.pipe(htmlmin({
collapseWhitespace: true,
removeComments: true
}))
.pipe(gulp.dest(DST));
});
gulp.task('sass', function() {
return merge(
gulp.src(SRC + 'css/estilos.scss')
.pipe(sass())
.pipe(uncss({
html: [DST + '*.html']
})),
gulp.src(SRC + 'css/looper.scss')
.pipe(sass()),
gulp.src(SRC + 'css/tooltip.scss')
.pipe(sass()),
gulp.src(SRC + 'css/acordeon.scss')
.pipe(sass())
)
.pipe(autoprefixer())
.pipe(concat('estilos.css'))
.pipe(nano())
.pipe(gulp.dest(DST + 'css/'));
});
// gulp.task('default', ['browser-sync'], function() {
// gulp.watch("src/css/**/*.scss", ['styles']);
// gulp.watch("src/js/**/*.js", ['scripts']);
// gulp.watch("*.html", ['bs-reload']);
// });
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment