emulsify-gulp/index.js at develop · ay13/emulsify-gulp · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
/* globals require */

module.exports = function(gulp, config) {
  'use strict';

  // General
  var gulp = require('gulp-help')(gulp);
  var _ = require('lodash');
  var browserSync = require('browser-sync').create();
  var defaultConfig = require('./gulp-config');
  var config = _.defaultsDeep(config, defaultConfig);

  // scripts
  var concat = require('gulp-concat');
  var uglify = require('gulp-uglify');

  // Image Minification
  var imagemin = require('gulp-imagemin');

  // icons
  var svgSprite = require('gulp-svg-sprite');

  // deploy
  var ghPages = require('gulp-gh-pages');

  var tasks = {
    compile: [],
    watch: [],
    validate: [],
    clean: [],
    default: []
  };

  // SCSS/CSS
  require('./gulp-tasks/gulp-css.js')(gulp, config, tasks, browserSync);

  // Tests
  require('./gulp-tasks/gulp-tests.js')(gulp, config, tasks);

  /**
   * Script Task
   */
  gulp.task('scripts', function () {
    return gulp.src(config.paths.js)
      // Concatenate everything within the JavaScript folder.
      .pipe(concat('scripts.js'))
      .pipe(uglify())
      .pipe(gulp.dest(config.paths.dist_js));
  });

  gulp.task('styleguide-scripts', function () {
    return gulp.src(config.paths.styleguide_js)
      // Concatenate everything within the JavaScript folder.
      .pipe(concat('scripts-styleguide.js'))
      .pipe(gulp.dest(config.paths.dist_js));
  });

  /**
   * Task for minifying images.
   */
  gulp.task('imagemin', function () {
    return gulp.src(config.paths.img + '/**/*')
      .pipe(imagemin({
        progressive: true,
        svgoPlugins: [
          {removeViewBox: false},
          {cleanupIDs: false}
        ]
      }))
      .pipe(gulp.dest(config.paths.dist_img));
  });

  /**
   * Task for generating icon colors/png fallbacks from svg.
   */
  gulp.task('icons', function () {
    return gulp.src('**/*.svg', {cwd: config.paths.img + '/icons/src'})
      .pipe(svgSprite(config.iconConfig))
      .pipe(gulp.dest(config.themeDir + '/images/icons'));
  });

  tasks.compile.push('icons');

  // Pattern Lab
  require('./gulp-tasks/gulp-pattern-lab.js')(gulp, config, tasks);

  /**
   * Task for running browserSync.
   */
  gulp.task('serve', ['css', 'scripts', 'styleguide-scripts', 'watch:pl'], function () {
    if (config.browserSync.domain) {
      browserSync.init({
        injectChanges: true,
        open: config.browserSync.openBrowserAtStart,
        proxy: config.browserSync.domain,
        startPath: config.browserSync.startPath
      });
    }
    else {
      browserSync.init({
        injectChanges: true,
        server: {
          baseDir: config.browserSync.baseDir
        },
        startPath: config.browserSync.startPath
      });
    }
    gulp.watch(config.paths.js, ['scripts']);
    gulp.watch(config.paths.styleguide_js, ['styleguide-scripts']);
    gulp.watch(config.paths.sass + '/**/*.scss', ['css']);

    browserSync.watch(config.browserSync.baseDir + 'dist/*.css').on('change', browserSync.reload);
    browserSync.watch(config.browserSync.baseDir + 'dist/*.js').on('change', browserSync.reload);
    browserSync.watch(config.browserSync.startPath + '**/*.html').on('change', browserSync.reload);
  });

  /**
   * Theme task declaration
   */
  gulp.task('theme', ['serve']);

  gulp.task('compile', tasks.compile);
  gulp.task('clean', tasks.clean);
  gulp.task('validate', tasks.validate);
  gulp.task('watch', tasks.watch);
  tasks.default.push('watch');
  gulp.task('default', tasks.default);

  /**
   * Theme task declaration
   */
  gulp.task('build', ['imagemin', 'clean', 'scripts', 'styleguide-scripts', 'css', 'icons']);

  /**
   * Deploy
   */
  gulp.task('deploy', function () {
    return gulp.src([
      config.paths.dist_js + '/**/*',
      config.paths.pattern_lab + '/**/*'
    ], { base: config.themeDir } )
    .pipe(ghPages());
  });

};