Using es6 version of main.js

sage
8

I tried your two solution, it runs without error but my main.js was not parsed through babel.
Here is my implementation of your code:

.pipe(function() {
  return gulpif(
    project.js.map(function(curr) {
      return require('path').resolve(curr);
    }),
    babel({ presets: ['es2015'] })
  );
})

BUT I finally got it working thanks God !!
I used gulp-filer package,

Enables you to work on a subset of the original files by filtering them
using globbing. When you’re done and want all the original files back
you just use the restore stream.

install with:
npm install --save-dev gulp-filter
and in gulpfile:

var filter       = require('gulp-filter');
var babel        = require('gulp-babel');

and here is my jsTasks

var jsTasks = function(filename) {
  var f = filter(project.js, {restore: true});
  return lazypipe()
    .pipe(function() {
      return gulpif(enabled.maps, sourcemaps.init());
    })
    .pipe(function() {
      return f;
    })
    .pipe(function() {
      return babel({ presets: ['es2015'] });
    })
    .pipe(function() {
      return f.restore;
    })
    .pipe(concat, filename)
    .pipe(function() {
        return gulpif(
          argv.production,
          uglify({ compress: { 'drop_debugger': enabled.stripJSDebug } })
        );
    })
    .pipe(function() {
      return gulpif(enabled.rev, rev());
    })
    .pipe(function() {
      return gulpif(enabled.maps, sourcemaps.write('.', {
        sourceRoot: path.source + 'scripts/'
      }));
    })();
};

Well, I don’t understand why I have to put pipe in a function. (It is the problem that bugged me for hours) I tried to do this :

// This DON'T WORK !!!
    .pipe(f)
    .pipe(babel({ presets: ['es2015'] }))
    .pipe(f.restore)

Can you explain it to me ? (I didn’t catch the gulp - pipe workflow very well)

At least it works perfectly now, thanks God.

2 Likes