Advertisement
Guest User

Untitled

a guest
Dec 9th, 2016
72
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.48 KB | None | 0 0
  1. 'use strict';
  2.  
  3. /*
  4. Instructions:
  5.  
  6. 1 - Should execute 'npm run prepare'
  7. before the very first run, it will install and symlink all dependencies.
  8.  
  9. 2 - Choose between production 'npm start' and development 'npm run start-dev' modes
  10. (watcher will run immediately after initial run).
  11.  
  12. */
  13.  
  14. // Define dependencies
  15. const env = process.env.NODE_ENV,
  16. gulp = require('gulp'),
  17. cache = require('gulp-cache'),
  18. clean = require('gulp-rimraf'),
  19. stream = require('event-stream'),
  20. browserSync = require('browser-sync'),
  21. browserify = require('browserify'),
  22. babelify = require('babelify'),
  23. uglify = require('gulp-uglify'),
  24. source = require('vinyl-source-stream'),
  25. size = require('gulp-size'),
  26. jshint = require('gulp-jshint'),
  27. concat = require('gulp-concat'),
  28. minifyCSS = require('gulp-minify-css'),
  29. base64 = require('gulp-base64'),
  30. imagemin = require('gulp-imagemin'),
  31. less = require('gulp-less'),
  32. jade = require('gulp-jade'),
  33. rename = require('gulp-rename'),
  34. notify = require("gulp-notify"),
  35. pluginAutoprefix = require('less-plugin-autoprefix');
  36.  
  37. const autoprefix = new pluginAutoprefix({ browsers: ["iOS >= 7", "Chrome >= 30", "Explorer >= 9", "last 2 Edge versions", "Firefox >= 20"] });
  38.  
  39. // Lint scripts
  40. gulp.task('lint', () => {
  41. return gulp.src('js/custom.js')
  42. .pipe(jshint())
  43. .pipe(jshint.reporter('default'));
  44. });
  45.  
  46. // Build views with Jade
  47. gulp.task('html', () => {
  48. var localsObject = {};
  49.  
  50. gulp.src('views/*.jade')
  51. .pipe(jade({
  52. locals: localsObject
  53. }))
  54. .pipe(gulp.dest('assets'))
  55. .pipe(browserSync.reload({stream:true}));
  56. });
  57.  
  58.  
  59. // Concat and minify styles
  60. // Compile *.less-files to css
  61. // Convert small images to base64, minify css
  62. gulp.task('styles', () => {
  63. return gulp.src('less/style.less')
  64. .pipe(less({
  65. plugins: [autoprefix]
  66. }))
  67. .on("error", notify.onError({
  68. message: 'LESS compile error: <%= error.message %>'
  69. }))
  70. .pipe(base64({
  71. extensions: ['jpg', 'png', 'svg'],
  72. maxImageSize: 32*1024 // max size in bytes, 32kb limit is strongly recommended due to IE limitations
  73. }))
  74. .pipe(minifyCSS({
  75. keepBreaks: false // New rule will have break if 'true'
  76. }))
  77. .pipe(gulp.dest('assets/css'))
  78. .pipe(size({
  79. title: 'size of styles'
  80. }))
  81. .pipe(browserSync.reload({stream:true}));
  82. });
  83.  
  84. /*
  85. Concat and minify scripts
  86.  
  87. Modules - task will transpile es2015(es6)
  88. with Babel and then bundle with Browserify.
  89.  
  90. Deps - task will concat all dependencies
  91. following strictly the order in array.
  92. */
  93. gulp.task('scripts', () => {
  94. const modules = browserify('js/app.js', {
  95. debug: env === "development" ? true : false
  96. })
  97. .transform(babelify, {presets: ["es2015", "react"]})
  98. .bundle()
  99. .on("error", notify.onError({
  100. message: 'Browserify error: <%= error.message %>'
  101. }))
  102. .pipe(source('bundle.js'))
  103. .pipe(gulp.dest('assets/js'))
  104. .pipe(size({
  105. title: 'size of modules'
  106. }));
  107.  
  108. const deps = gulp.src(['js/libs/*jquery*', 'js/libs/*lodash*'])
  109. .pipe(concat('libs.js'))
  110. .pipe(uglify())
  111. .pipe(gulp.dest('assets/js'))
  112. .pipe(size({
  113. title: 'size of js dependencies'
  114. }));
  115. stream.concat(modules, deps).pipe(browserSync.reload({stream:true, once: true}));
  116. });
  117.  
  118. // Compress images
  119. // Will cache to process only changed images, but not all in image folder
  120. // optimizationLevel - range from 0 to 7 (compression will work from 1) which means number of attempts
  121. gulp.task('images', () => {
  122. return gulp.src(['images/*', '!images/*.db'])
  123. .pipe(cache(imagemin({
  124. optimizationLevel: 5,
  125. progressive: true,
  126. interlaced: true
  127. })))
  128. .on("error", notify.onError({
  129. message: 'Images processing error: <%= error.message %>'
  130. }))
  131. .pipe(gulp.dest('assets/images'))
  132. .pipe(size({
  133. title: 'size of images'
  134. }));
  135. });
  136.  
  137. // Clean destination dir and rebuild project
  138. gulp.task('clean', () => {
  139. return gulp.src(['assets/css', 'assets/js', 'assets/*.html'], {read: false})
  140. .pipe(clean());
  141. });
  142.  
  143. // Clean images cache
  144. gulp.task('clear', (done) => {
  145. return cache.clearAll(done);
  146. });
  147.  
  148. // Livereload will up local server
  149. // and inject all changes made
  150. gulp.task('browser-sync', () => {
  151. browserSync({
  152. server: {
  153. baseDir: "./assets"
  154. }
  155. });
  156. });
  157.  
  158. // Watcher will look for changes and execute tasks
  159. gulp.task('watch', ['browser-sync'], () => {
  160. gulp.watch('views/**/*.jade', ['html']);
  161. gulp.watch('js/**/*.js', ['lint', 'scripts']);
  162. gulp.watch('less/**/*.less', ['styles']);
  163. gulp.watch('images/*', ['images']);
  164. });
  165.  
  166. // Default task will clean build dirs/build project and clear image cache
  167. gulp.task('default', ['clean', 'clear'], () => {
  168. gulp.start('styles', 'scripts', 'images', 'html');
  169. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement