Babel Does not Change Promises at All

Question

I don't totally get how Babel is meant to work. I've played around with it and it transpiles some things but not others. An example of this is promises. I'll set out the config of my project and the results:

I've targeted IE 10 (.browserslistrc):

>= 1%
last 1 major version
not dead
Chrome >= 45
Firefox >= 38
Edge >= 12
Explorer >= 10
iOS >= 9
Safari >= 9
Android >= 4.4
Opera >= 30

babel.config.js

const presets = [
  [
    '@babel/preset-env',
    {
      useBuiltIns: 'entry',
      debug: true,
      corejs: { version: '3.2.1' }
    }
  ]
];

module.exports = { presets };

A file called promises.js

var promise1 = new Promise(function (resolve, reject) {
  setTimeout(function () {
    resolve('foo');
  }, 300);
});

promise1
  .then(function (value) {
    console.log(value);    
  });

I'm just calling the cli using "babel src -d lib"

As I said, the promises file is reproduced, as is, despite the fact that IE10 does not support them. I have included core-js in the solution as a dependency, but have not manually invoked it at all (I'm not sure whether Babel uses it).

If someone could help me understand this, it would be great.

Thanks

Answer 1

A little bit more time (read as, a heck of a LOT of time) with Babel.js and I have learnt the answer to my question.

I did not comprehend the fact that Babel transpiles some things and polyfills others. And by polyfill, I mean it delegates the job of polyfilling to core.js.

This took ages for the penny to drop, because Babel is touted as a Javascript compiler. Technically it is. But it is also a delegator :)

To canvas a few things, these are transpiled:

• arrow functions
• classes
• the Destructuring operator

whilst these are polyfilled:

• fetch
• promises

My question was about promises. And therein lies the answer. Hope this helps others new to Babel.