ES6 Class breaks build as "reserved keyword"

[daanaerts]

class WebSocket {

[12:01:50] [AngularFilesort] Error in plugin 'gulp-angular-filesort'
Message:
    Error in parsing: "components/api/websocket.service.js", Line 6: Unexpected reserved word

[pleerock]

arrow functions are not working as well

[Javarome]

The sort is assuming files are ES5, so you have to transpile your ES6 to ES5 first, then sort the resulting ES5 files, like below:

gulp.task('es6toes5', function () {
  return gulp.src(es6Sources)
    .pipe(es6transpile())    // Babel, traceur or whatever
    .pipe(gulp.dest('es5'));
});

gulp.task('dist', ['es6toes5'], function () {
  return gulp.src('index.html')
    .pipe(inject(gulp.src(['es5/**/*.js']).pipe(angularFilesort())))
    .pipe(gulp.dest('dist'));
});

[daanaerts]

Thanks Javarome,

it works fine so far. Piping directly is easiest option I found.

var injectScripts = gulp.src([
      path.join(conf.paths.src, '/app/**/*.module.js'),
      path.join(conf.paths.src, '/app/**/*.js'),
      path.join('!' + conf.paths.src, '/app/**/*.spec.js'),
      path.join('!' + conf.paths.src, '/app/**/*.mock.js')
    ])
    .pipe($.es6Transpiler({
      globals: {
        globalvars.
      }
    }))
    .pipe($.angularFilesort()).on('error', conf.errorHandler('AngularFilesort'));

[Javarome]

Yep, that's better. Thanks for the tip.

[joakimbeng]

For anyone seeing this I recommend using one of @Javarome or @daanaerts solutions above.

Or even better, skip this plugin altogether by using Browserify or Webpack...

[hustshawn]

@daanaerts May I know how your globalvars defined?

[kyleThayerXpanxion]

If you are using babel, you can just use:

var injectScripts = gulp.src([
      path.join(conf.paths.src, '/app/**/*.module.js'),
      path.join(conf.paths.src, '/app/**/*.js'),
      path.join('!' + conf.paths.src, '/app/**/*.spec.js'),
      path.join('!' + conf.paths.src, '/app/**/*.mock.js')
    ])
   .pipe(babel())
    .pipe($.angularFilesort()).on('error', conf.errorHandler('AngularFilesort'));