quocvuongdn

#gulpfile setting for front-end task

Mar 10th, 2017
112
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. var gulp        = require('gulp'),
  2.     gutil       = require('gulp-util'),
  3.     sass        = require('gulp-sass'),
  4.     csso        = require('gulp-csso'),
  5.     uglify      = require('gulp-uglify'),
  6.     jade        = require('gulp-jade'),
  7.     concat      = require('gulp-concat'),
  8.     livereload  = require('gulp-livereload'), // Livereload plugin needed: https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei
  9.     tinylr      = require('tiny-lr'),
  10.     express     = require('express'),
  11.     app         = express(),
  12.     marked      = require('marked'), // For :markdown filter in jade
  13.     path        = require('path'),
  14.     server      = tinylr();
  15.  
  16.  
  17. // --- Basic Tasks ---
  18. gulp.task('bower', function() {
  19.   return gulp.src('bower_components/**/*')
  20.     .pipe(gulp.dest('dist/vendors/'))
  21.     .pipe(livereload(server));
  22. });
  23.  
  24. gulp.task('images', function() {
  25.   return gulp.src('images/**/*')
  26.     .pipe(gulp.dest('dist/images/'))
  27.     .pipe(livereload(server));
  28. });
  29.  
  30. gulp.task('css', function() {
  31.   return gulp.src('src/assets/stylesheets/*.scss')
  32.     .pipe(
  33.       sass( {
  34.         includePaths: ['src/assets/stylesheets'],
  35.         errLogToConsole: true
  36.       } ) )
  37.     .pipe( csso() )
  38.     .pipe( gulp.dest('dist/assets/stylesheets/') )
  39.     .pipe( livereload( server ));
  40. });
  41.  
  42. gulp.task('js', function() {
  43.   return gulp.src('src/assets/scripts/*.js')
  44.     .pipe( uglify() )
  45.     .pipe( concat('all.min.js'))
  46.     .pipe( gulp.dest('dist/assets/scripts/'))
  47.     .pipe( livereload( server ));
  48. });
  49.  
  50. gulp.task('templates', function() {
  51.   return gulp.src('src/*.jade')
  52.     .pipe(jade({
  53.       pretty: true
  54.     }))
  55.     .pipe(gulp.dest('dist/'))
  56.     .pipe( livereload( server ));
  57. });
  58.  
  59. gulp.task('express', function() {
  60.   app.use(express.static(path.resolve('./dist')));
  61.   app.listen(1337);
  62.   gutil.log('Listening on port: 1337');
  63. });
  64.  
  65. gulp.task('watch', function () {
  66.   server.listen(35729, function (err) {
  67.     if (err) {
  68.       return console.log(err);
  69.     }
  70.  
  71.     gulp.watch('src/assets/stylesheets/*.scss',['css']);
  72.  
  73.     gulp.watch('src/assets/scripts/*.js',['js']);
  74.  
  75.     gulp.watch('src/**/*.jade',['templates']);
  76.    
  77.     gulp.watch('bower_components/**/*', ['bower']);
  78.  
  79.     gulp.watch('images/**/*', ['images']);
  80.   });
  81. });
  82.  
  83. // Default Task
  84. gulp.task('default', ['images', 'bower', 'js','css','templates','express','watch']);
Advertisement
Add Comment
Please, Sign In to add comment