Promise is undefined in IE11 using babel-polyfill

mitomed picture mitomed · Sep 23, 2018 · Viewed 23.2k times · Source

As the title says, even I'd like to use babel-polyfill to allow me to use promises in my code, but I get that undefined error in IE11.

I've been trying to make this work for a while as I've seen that has been asked in different sites a few times, but none of the solutions really worked for me (or more accurately I was probably not able to adapt them to my code)

These are the files that, I think, are involved:

.babelrc

{
    "presets": [
        "es2015",
        "react"
    ]
}

package.json: I have babel-polyfill under dev-dependencies and tried to put it under dependencies (both just manually swapping and installing it through the console) and none seemed to work

My script.js doesn't have it as import (but if I tried to import @babel-polyfill, or the different combinations with forward slash when I saw that syntax in package.json, doesn't find the module)

Finally my gulpfile.babel.js has this task:

gulp.task('build:js', ['lint'], () => {
    return browserify({
            entries: path.resolve(paths().source.js, 'script.js'),
            extensions: ['.jsx'],
            debug: true
        })
        .transform(babelify)
        .plugin('minifyify', {
            map: 'script.js.map.json',
            output: path.resolve(paths().public.js, 'script.js.map.json')
        })
        .bundle()
        .pipe(source('script.js'))
        .pipe(gulp.dest(path.resolve(paths().public.js)))
        .pipe(notify({
            onLast: true,
            message: 'Building JS done'
        }));
});

What I'm doing wrong?

Thanks

Answer

connexo picture connexo · Sep 23, 2018

You need to import Babel polyfilly before any other non-polyfill code in your JS entry point:

import 'babel-polyfill';

or if you have already switched to Babel 7:

import '@babel/polyfill';

Also note that you should switch your presets to preset-env. I'd recommend you upgrade to Babel 7 and use @babel/preset-env.

Assuming you have done the switch to Babel 7, this is what your .babelrc should look like:

{
  "presets": [
    [ "@babel/preset-env", {
      "targets": {
        "browsers": [ "last 1 version", "ie >= 11" ]
      }
    }]
  ]
}