5

While working with babel in a node.js project, I'm trying to bundle all my files into a single transpiled and minified js file.

I'm running babel with gulp-babel 6.1.2, I've installed ES-2015 preset (6.13.2).

I'm building a bundle with my files, and typeahead 0.11.1, the issue is that when running the gulp task and piping through babel, the typeahed functionality is not working (Uncaught TypeError: Cannot set property 'Bloodhound' of undefined). If I run the task again, removing the babel command from the pipe line, everything works fine.

I know that I can build two separate bundles, one for my files, other for external files, but I would like to know why it's failing.

My gulp task:

gulp.task('bundleCheckoutDesktopJs', function () {
var js = ['./src/js/project/external/*', './src/js/project/common/*', './src/js/project/*'];

return gulp.src(js)
    .pipe(babel())
    .pipe(concat('project.min.js'))
    .pipe(uglify())
    .pipe(gulp.dest('statics/js/'));
});

Results that I've achieved after investigating a little while (typeahead.js):

(function(root, factory) {
   if (typeof define === "function" && define.amd) {
      define("bloodhound", [ "jquery" ], function(a0) {
          return root["Bloodhound"] = factory(a0);
      });
   } else if (typeof exports === "object") {
      module.exports = factory(require("jquery"));
   } else {
     // Root seems to be undefined here....
     root["Bloodhound"] = factory(jQuery);

   }
})

Any help will be appreciated, thanks in advance.

Guillermo
  • 1,493
  • 3
  • 16
  • 35

1 Answers1

0

Plugin code: In the immediately invoking function, give the first parameter as window. In case arrow function used, probably not finding this context.

/*!
 * typeahead.js 0.11.1
 * https://github.com/twitter/typeahead.js
 * Copyright 2013-2015 Twitter, Inc. and other contributors; Licensed MIT
 */

(function(root, factory) {
    if (typeof define === "function" && define.amd) {
        define("bloodhound", [ "jquery" ], function(a0) {
            return root["Bloodhound"] = factory(a0);
        });
    } else if (typeof exports === "object") {
        module.exports = factory(require("jquery"));
    } else {
        root["Bloodhound"] = factory(jQuery);
    }
})(this, function($) { // here replace 'this' with window