Update to gulp v4 (#1046) (#1050)

Author: IlyaKhD

build.config.js

@@ -58,7 +58,8 @@ module.exports = {
         srcFilesPattern: '**/*.ts',
         tsTestSrc: ['tests/src/**/*.spec.ts', 'tests/src/**/component-names.ts'],
         testsPath: 'tests/dist',
-        sourcePath: 'src',
+        sourcesGlobs: ['src/**/*.*', './package.json'],
+        tsSourcesGlob: 'src/**/*.ts',
         outputPath: 'dist'
     },
     examples: {	

examples/systemjs.config.js

@@ -57,7 +57,13 @@
       },
       'devextreme': {
         defaultExtension: 'js'
-      }
+      },
+      'devextreme/events/utils': {
+        main: 'index'
+      },
+      'devextreme/events': {
+        main: 'index'
+      },
     },
     packageConfigPaths: [
       '../npm/*/package.json',

gulpfile.js

@@ -1,5 +1,4 @@
 var gulp = require('gulp');
-var runSequence = require("run-sequence");
 var path = require('path');
 var typescript = require('gulp-typescript');
 var tslint = require('gulp-tslint');
@@ -15,16 +14,6 @@ var buildConfig = require('./build.config');
 var header = require('gulp-header');
 var ngPackagr = require('ng-packagr');
 
-//------------Main------------
-
-gulp.task('build', [
-    'build.tools',
-    'build.components'
-]);
-
-gulp.task('default', ['build']);
-
-
 //------------Tools------------
 
 gulp.task('build.tools', function() {
@@ -40,44 +29,49 @@ gulp.task('build.tools', function() {
 
 //------------Components------------
 
-gulp.task('clean.metadata', ['build.tools'], function () {
+gulp.task('clean.metadata', gulp.series('build.tools', function() {
     var outputFolderPath = buildConfig.tools.metadataGenerator.outputFolderPath;
 
     return del([outputFolderPath]);
-});
+}));
 
-gulp.task('generate.metadata', ['build.tools', 'clean.metadata'], function () {
+gulp.task('generate.metadata', gulp.series('build.tools', 'clean.metadata', function(done) {
     var MetadataGenerator = require(buildConfig.tools.metadataGenerator.importFrom).default,
         generator = new MetadataGenerator();
 
     generator.generate(buildConfig.tools.metadataGenerator);
-});
+    done();
+}));
 
-gulp.task('clean.generatedComponents', function () {
+gulp.task('clean.generatedComponents', function(done) {
     var { outputFolderPath } = buildConfig.tools.componentGenerator;
     del.sync([outputFolderPath + "/**"]);
+    done();
 });
 
-gulp.task('generate.components', ['generate.metadata', 'clean.generatedComponents'], function () {
+gulp.task('generate.components', gulp.series('generate.metadata', 'clean.generatedComponents', function(done) {
     var DoTGenerator = require(buildConfig.tools.componentGenerator.importFrom).default,
         generator = new DoTGenerator();
 
     generator.generate(buildConfig.tools.componentGenerator);
-});
+    done();
+}));
 
-gulp.task('generate.moduleFacades', ['generate.components'], function () {
+gulp.task('generate.moduleFacades', gulp.series('generate.components', function(done) {
     var ModuleFacadeGenerator = require(buildConfig.tools.moduleFacadeGenerator.importFrom).default,
         moduleFacadeGenerator = new ModuleFacadeGenerator();
 
     moduleFacadeGenerator.generate(buildConfig.tools.moduleFacadeGenerator);
-});
+    done();
+}));
 
-gulp.task('generate.facades', ['generate.moduleFacades'], function () {
+gulp.task('generate.facades', gulp.series('generate.moduleFacades', function(done) {
     var FacadeGenerator = require(buildConfig.tools.facadeGenerator.importFrom).default,
         facadeGenerator = new FacadeGenerator();
 
     facadeGenerator.generate(buildConfig.tools.facadeGenerator);
-});
+    done();
+}));
 
 gulp.task('build.license-headers', function() {
     var config = buildConfig.components,
@@ -105,12 +99,12 @@ gulp.task('build.license-headers', function() {
         '\n' // This new line is necessary to keep the header after TS compilation
         ].join('\n');
 
-    return gulp.src(path.join(config.outputPath, config.srcFilesPattern))
+    return gulp.src(`${config.outputPath}/${config.srcFilesPattern}`)
         .pipe(header(banner, data))
         .pipe(gulp.dest(config.outputPath));
 });
 
-gulp.task('clean.dist', function () {
+gulp.task('clean.dist', function() {
     del.sync([buildConfig.components.outputPath + "/*.*"]);
     return del([buildConfig.components.outputPath]);
 });
@@ -122,54 +116,87 @@ gulp.task('build.ngc', function() {
     });
 });
 
-gulp.task('build.copy-sources', ['clean.dist'], function() {
+gulp.task('build.copy-sources', gulp.series('clean.dist', function() {
     var config = buildConfig.components;
-    return gulp.src([path.join(config.sourcePath, '**/*.*'), 'package.json'])
+    return gulp.src(config.sourcesGlobs)
         .pipe(gulp.dest(config.outputPath));
-});
+}));
 
 // Note: workaround for https://github.com/angular/angular-cli/issues/4874
 gulp.task('build.remove-unusable-variable', function() {
     var config = buildConfig.npm;
 
-    return gulp.src(path.join(config.distPath, '**/*.js'))
+    return gulp.src(config.distPath + '/**/*.js')
         .pipe(replace(/DevExpress\.[\w\.]+/g, 'Object'))
         .pipe(gulp.dest(config.distPath));
 });
 
-gulp.task('build.components', ['generate.facades'], function(done) {
-    runSequence(
+gulp.task('build.components', gulp.series('generate.facades', 
         'build.copy-sources',
         'build.license-headers',
         'build.ngc',
-        'build.remove-unusable-variable',
-        done
-    );
-});
-
+        'build.remove-unusable-variable'
+));
 
 //------------npm------------
 
-gulp.task('npm.content', ['build.components'], function() {
+gulp.task('npm.content', gulp.series('build.components', function() {
     var npmConfig = buildConfig.npm,
         cmpConfig = buildConfig.components;
 
-    return gulp.src([path.join(cmpConfig.outputPath, '**/collection.json'), ...npmConfig.content])
+    return gulp.src([cmpConfig.outputPath + '/**/collection.json', ...npmConfig.content])
         .pipe(gulp.dest(npmConfig.distPath));
+}));
+
+gulp.task('npm.pack', gulp.series('npm.content', shell.task(['npm pack'], { cwd: buildConfig.npm.distPath })));
+
+//------------TSLint------------
+
+gulp.task('lint', function() {
+    return gulp.src([buildConfig.components.tsSourcesGlob]
+            .concat(buildConfig.components.tsTestSrc)
+            .concat(buildConfig.examples.srcFilesPattern)
+            .concat(buildConfig.tools.srcFilesPattern)
+        )
+        .pipe(tslint({
+            formatter: 'prose',
+            tslint: require('tslint').default,
+            rulesDirectory: null,
+            configuration: 'tslint.json'
+        }))
+        .pipe(tslint.report());
 });
 
-gulp.task('npm.pack', ['npm.content'], shell.task(['npm pack'], { cwd: buildConfig.npm.distPath }));
+
+//------------Main------------
+
+var buildTask = gulp.series(
+    'build.tools',
+    'build.components'
+);
+
+gulp.task('build', buildTask);
+gulp.task('default', buildTask);
 
 
 //------------Testing------------
 
-gulp.task('clean.tests', function () {
+gulp.task('clean.tests', function() {
     var outputFolderPath = buildConfig.components.testsPath;
 
     return del([outputFolderPath]);
 });
 
-gulp.task('build.tests', ['clean.tests', 'generate-component-names'], function() {
+gulp.task('generate-component-names', gulp.series('build.tools', function(done) {
+    var ComponentNamesGenerator = require(buildConfig.tools.componentNamesGenerator.importFrom).default;
+    var generator = new ComponentNamesGenerator(buildConfig.tools.componentNamesGenerator);
+
+    generator.generate();
+
+    done();
+}));
+
+gulp.task('build.tests', gulp.series('clean.tests', 'generate-component-names', function() {
     var config = buildConfig.components,
         testConfig = buildConfig.tests;
 
@@ -178,7 +205,7 @@ gulp.task('build.tests', ['clean.tests', 'generate-component-names'], function()
         .pipe(typescript(testConfig.tsConfigPath))
         .pipe(sourcemaps.write('.'))
         .pipe(gulp.dest(config.testsPath));
-});
+}));
 
 gulp.task('watch.spec', function() {
     gulp.watch(buildConfig.components.tsTestSrc, ['build.tests']);
@@ -193,29 +220,15 @@ var getKarmaConfig = function(testsPath) {
     });
 };
 
-gulp.task('test.components', function(done) {
-    runSequence(
-        'test.components.server',
-        'test.components.client',
-        done);
-});
-
-gulp.task('test.components.client', ['build.tests'], function(done) {
+gulp.task('test.components.client', gulp.series('build.tests', function(done) {
     new karmaServer(getKarmaConfig('./karma.test.shim.js'), done).start();
-});
-
-gulp.task('generate-component-names', ['build.tools'], function(done) {
-    var ComponentNamesGenerator = require(buildConfig.tools.componentNamesGenerator.importFrom).default;
-    var generator = new ComponentNamesGenerator(buildConfig.tools.componentNamesGenerator);
-
-    generator.generate();
+}));
 
-    done();
-});
-
-gulp.task('test.components.server', ['build.tests'], function(done) {
+gulp.task('test.components.server', gulp.series('build.tests', function(done) {
     new karmaServer(getKarmaConfig('./karma.server.test.shim.js'), done).start();
-});
+}));
+
+gulp.task('test.components', gulp.series('test.components.server', 'test.components.client'));
 
 gulp.task('test.components.client.debug', function(done) {
     var config = getKarmaConfig('./karma.test.shim.js');
@@ -249,39 +262,12 @@ gulp.task('test.tools', function(done) {
         }));
 });
 
-gulp.task('run.tests', function(done) {
-    runSequence(
-        ['test.tools', 'test.components'],
-        'lint',
-        done);
-});
+gulp.task('run.tests', gulp.series(gulp.parallel('test.tools', 'test.components')));
 
-gulp.task('test', function(done) {
-    runSequence(
-        'build', 'build.tests', 'run.tests',
-        done);
-});
+gulp.task('test', gulp.series('build', 'build.tests', 'run.tests'));
 
 gulp.task('watch.test', function(done) {
     new karmaServer({
         configFile: __dirname + '/karma.conf.js'
     }, done).start();
 });
-
-
-//------------TSLint------------
-
-gulp.task('lint', function() {
-    return gulp.src([path.join(buildConfig.components.sourcePath, buildConfig.components.srcFilesPattern)]
-            .concat(buildConfig.components.tsTestSrc)
-            .concat(buildConfig.examples.srcFilesPattern)
-            .concat(buildConfig.tools.srcFilesPattern)
-        )
-        .pipe(tslint({
-            formatter: 'prose',
-            tslint: require('tslint').default,
-            rulesDirectory: null,
-            configuration: 'tslint.json'
-        }))
-        .pipe(tslint.report());
-});

package.json

@@ -47,7 +47,7 @@
     "devexpress-gantt": "0.0.8",
     "devextreme": "~19.2.5-build-19347-0331",
     "dot": "^1.0.3",
-    "gulp": "^3.9.1",
+    "gulp": "^4.0.0",
     "gulp-header": "^1.8.8",
     "gulp-jasmine": "^2.3.0",
     "gulp-merge-json": "^0.6.0",
@@ -72,7 +72,6 @@
     "ng-packagr": "5.5.1",
     "plugin-typescript": "^8.0.0",
     "puppeteer": "^1.11.0",
-    "run-sequence": "^1.2.2",
     "rxjs": "^6.0.0",
     "systemjs": "0.21.6",
     "tslint": "^4.5.1",