gulpfile.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. // Utilities
  2. var autoprefixer = require('autoprefixer');
  3. var cssnano = require('cssnano');
  4. var fs = require('fs');
  5. // Gulp
  6. var gulp = require('gulp');
  7. // Gulp plugins
  8. var concat = require('gulp-concat');
  9. var gutil = require('gulp-util');
  10. var header = require('gulp-header');
  11. var postcss = require('gulp-postcss');
  12. var rename = require('gulp-rename');
  13. var runSequence = require('run-sequence');
  14. // Misc/global vars
  15. var pkg = JSON.parse(fs.readFileSync('package.json'));
  16. var activatedAnimations = activateAnimations();
  17. // Task options
  18. var opts = {
  19. destPath: './',
  20. concatName: 'animate.css',
  21. autoprefixer: {
  22. browsers: ['> 1%', 'last 2 versions', 'Firefox ESR'],
  23. cascade: false,
  24. },
  25. minRename: {
  26. suffix: '.min',
  27. },
  28. banner: [
  29. '@charset "UTF-8";\n',
  30. '/*!',
  31. ' * <%= name %> -<%= homepage %>',
  32. ' * Version - <%= version %>',
  33. ' * Licensed under the MIT license - http://opensource.org/licenses/MIT',
  34. ' *',
  35. ' * Copyright (c) <%= new Date().getFullYear() %> <%= author.name %>',
  36. ' */\n\n',
  37. ].join('\n'),
  38. };
  39. // ----------------------------
  40. // Gulp task definitions
  41. // ----------------------------
  42. gulp.task('createCSS', function() {
  43. return gulp
  44. .src(activatedAnimations)
  45. .pipe(concat(opts.concatName))
  46. .pipe(postcss([autoprefixer(opts.autoprefixer)]))
  47. .pipe(gulp.dest(opts.destPath))
  48. .pipe(postcss([cssnano({reduceIdents: {keyframes: false}})]))
  49. .pipe(rename(opts.minRename))
  50. .pipe(gulp.dest(opts.destPath));
  51. });
  52. gulp.task('addHeader', function() {
  53. return gulp
  54. .src('*.css')
  55. .pipe(header(opts.banner, pkg))
  56. .pipe(gulp.dest(opts.destPath));
  57. });
  58. gulp.task('default', gulp.series('createCSS', 'addHeader'));
  59. // ----------------------------
  60. // Helpers/functions
  61. // ----------------------------
  62. // Read the config file and return an array of the animations to be activated
  63. function activateAnimations() {
  64. var categories = JSON.parse(fs.readFileSync('animate-config.json')),
  65. category,
  66. files,
  67. file,
  68. target = [],
  69. count = 0;
  70. for (category in categories) {
  71. if (categories.hasOwnProperty(category)) {
  72. files = categories[category];
  73. for (file in files) {
  74. if (files[file]) {
  75. // marked as true
  76. target.push('source/' + category + '/' + file + '.css');
  77. count += 1;
  78. }
  79. }
  80. }
  81. }
  82. // prepend base CSS
  83. target.push('source/_base.css');
  84. if (!count) {
  85. gutil.log('No animations activated.');
  86. } else {
  87. gutil.log(count + (count > 1 ? ' animations' : ' animation') + ' activated.');
  88. }
  89. return target;
  90. }