vis.js is a dynamic, browser-based visualization library
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

219 lines
6.0 KiB

  1. var fs = require('fs');
  2. var async = require('async');
  3. var gulp = require('gulp');
  4. var gutil = require('gulp-util');
  5. var concat = require('gulp-concat');
  6. var cleanCSS = require('gulp-clean-css');
  7. var rename = require("gulp-rename");
  8. var webpack = require('webpack');
  9. var uglify = require('uglify-js');
  10. var rimraf = require('rimraf');
  11. var argv = require('yargs').argv;
  12. var ENTRY = './index.js';
  13. var HEADER = './lib/header.js';
  14. var DIST = './dist';
  15. var VIS_JS = 'vis.js';
  16. var VIS_MAP = 'vis.map';
  17. var VIS_MIN_JS = 'vis.min.js';
  18. var VIS_CSS = 'vis.css';
  19. var VIS_MIN_CSS = 'vis.min.css';
  20. var INDIVIDUAL_JS_BUNDLES = [
  21. {entry: './index-timeline-graph2d.js', filename: 'vis-timeline-graph2d.min.js'},
  22. {entry: './index-network.js', filename: 'vis-network.min.js'},
  23. {entry: './index-graph3d.js', filename: 'vis-graph3d.min.js'}
  24. ];
  25. var INDIVIDUAL_CSS_BUNDLES = [
  26. {entry: ['./lib/shared/**/*.css', './lib/timeline/**/*.css'], filename: 'vis-timeline-graph2d.min.css'},
  27. {entry: ['./lib/shared/**/*.css', './lib/network/**/*.css'], filename: 'vis-network.min.css'}
  28. ];
  29. // generate banner with today's date and correct version
  30. function createBanner() {
  31. var today = gutil.date(new Date(), 'yyyy-mm-dd'); // today, formatted as yyyy-mm-dd
  32. var version = require('./package.json').version;
  33. return String(fs.readFileSync(HEADER))
  34. .replace('@@date', today)
  35. .replace('@@version', version);
  36. }
  37. var bannerPlugin = new webpack.BannerPlugin(createBanner(), {
  38. entryOnly: true,
  39. raw: true
  40. });
  41. var webpackModule = {
  42. loaders: [
  43. {
  44. test: /\.js$/,
  45. exclude: /node_modules/,
  46. loader: 'babel-loader',
  47. query: {
  48. cacheDirectory: true, // use cache to improve speed
  49. babelrc: true // use the .baberc file
  50. }
  51. }
  52. ],
  53. // exclude requires of moment.js language files
  54. wrappedContextRegExp: /$^/
  55. };
  56. var webpackConfig = {
  57. entry: ENTRY,
  58. output: {
  59. library: 'vis',
  60. libraryTarget: 'umd',
  61. path: DIST,
  62. filename: VIS_JS,
  63. sourcePrefix: ' '
  64. },
  65. module: webpackModule,
  66. plugins: [ bannerPlugin ],
  67. cache: true,
  68. // generate details sourcempas of webpack modules
  69. //devtool: 'source-map'
  70. //debug: true,
  71. //bail: true
  72. };
  73. var uglifyConfig = {
  74. outSourceMap: VIS_MAP,
  75. output: {
  76. comments: /@license/
  77. }
  78. };
  79. // create a single instance of the compiler to allow caching
  80. var compiler = webpack(webpackConfig);
  81. function handleCompilerCallback (err, stats) {
  82. if (err) {
  83. gutil.log(err.toString());
  84. }
  85. if (stats && stats.compilation && stats.compilation.errors) {
  86. // output soft errors
  87. stats.compilation.errors.forEach(function (err) {
  88. gutil.log(err.toString());
  89. });
  90. if (err || stats.compilation.errors.length > 0) {
  91. gutil.beep(); // TODO: this does not work on my system
  92. }
  93. }
  94. }
  95. // clean the dist/img directory
  96. gulp.task('clean', function (cb) {
  97. rimraf(DIST + '/img', cb);
  98. });
  99. gulp.task('bundle-js', function (cb) {
  100. // update the banner contents (has a date in it which should stay up to date)
  101. bannerPlugin.banner = createBanner();
  102. compiler.run(function (err, stats) {
  103. handleCompilerCallback(err, stats);
  104. cb();
  105. });
  106. });
  107. // create individual bundles for timeline+graph2d, network, graph3d
  108. gulp.task('bundle-js-individual', function (cb) {
  109. // update the banner contents (has a date in it which should stay up to date)
  110. bannerPlugin.banner = createBanner();
  111. async.each(INDIVIDUAL_JS_BUNDLES, function (item, callback) {
  112. var webpackTimelineConfig = {
  113. entry: item.entry,
  114. output: {
  115. library: 'vis',
  116. libraryTarget: 'umd',
  117. path: DIST,
  118. filename: item.filename,
  119. sourcePrefix: ' '
  120. },
  121. module: webpackModule,
  122. plugins: [ bannerPlugin, new webpack.optimize.UglifyJsPlugin() ],
  123. cache: true
  124. };
  125. var compiler = webpack(webpackTimelineConfig);
  126. compiler.run(function (err, stats) {
  127. handleCompilerCallback(err, stats);
  128. callback();
  129. });
  130. }, cb);
  131. });
  132. // bundle and minify css
  133. gulp.task('bundle-css', function () {
  134. return gulp.src('./lib/**/*.css')
  135. .pipe(concat(VIS_CSS))
  136. .pipe(gulp.dest(DIST))
  137. // TODO: nicer to put minifying css in a separate task?
  138. .pipe(cleanCSS())
  139. .pipe(rename(VIS_MIN_CSS))
  140. .pipe(gulp.dest(DIST));
  141. });
  142. // bundle and minify individual css
  143. gulp.task('bundle-css-individual', function (cb) {
  144. async.each(INDIVIDUAL_CSS_BUNDLES, function (item, callback) {
  145. return gulp.src(item.entry)
  146. .pipe(concat(item.filename))
  147. .pipe(cleanCSS())
  148. .pipe(rename(item.filename))
  149. .pipe(gulp.dest(DIST))
  150. .on('end', callback);
  151. }, cb);
  152. });
  153. gulp.task('copy', ['clean'], function () {
  154. var network = gulp.src('./lib/network/img/**/*')
  155. .pipe(gulp.dest(DIST + '/img/network'));
  156. return network;
  157. });
  158. gulp.task('minify', ['bundle-js'], function (cb) {
  159. var result = uglify.minify([DIST + '/' + VIS_JS], uglifyConfig);
  160. // note: we add a newline '\n' to the end of the minified file to prevent
  161. // any issues when concatenating the file downstream (the file ends
  162. // with a comment).
  163. fs.writeFileSync(DIST + '/' + VIS_MIN_JS, result.code + '\n');
  164. fs.writeFileSync(DIST + '/' + VIS_MAP, result.map.replace(/"\.\/dist\//g, '"'));
  165. cb();
  166. });
  167. gulp.task('bundle', ['bundle-js', 'bundle-js-individual', 'bundle-css', 'bundle-css-individual', 'copy']);
  168. // read command line arguments --bundle and --minify
  169. var bundle = 'bundle' in argv;
  170. var minify = 'minify' in argv;
  171. var watchTasks = [];
  172. if (bundle || minify) {
  173. // do bundling and/or minifying only when specified on the command line
  174. watchTasks = [];
  175. if (bundle) watchTasks.push('bundle');
  176. if (minify) watchTasks.push('minify');
  177. }
  178. else {
  179. // by default, do both bundling and minifying
  180. watchTasks = ['bundle', 'minify'];
  181. }
  182. // The watch task (to automatically rebuild when the source code changes)
  183. gulp.task('watch', watchTasks, function () {
  184. gulp.watch(['index.js', 'lib/**/*'], watchTasks);
  185. });
  186. // The default task (called when you run `gulp`)
  187. gulp.task('default', ['clean', 'bundle', 'minify']);