How is the global polyfill promise implemented in webpack v2?

Question

I would like to better understand the differences between how promises are implemented in webpack. Usually blissful ignorance was enough to handle this, as I mostly develop applications, but I definitely got a little confused about how to properly develop the plugin / tool / lib.

---

When creating applications, the following two approaches never caused any problems; I guess that basically it doesn't matter.

webpack.config.js - using babel-polyfill as an entry point

module.exports = {
  entry: {
    foo: [
      'core-js/fn/promise',          <-- here
      './js/index.js'
    ]
  },

  module: {
    rules: [
      {
        test: /\.js$/,
        loader: 'babel-loader'
      }
    ]
  }
}

Q: In this approach, since it a polyfill changes the global promise?

webpack config - shimming with webpacks provide a plugin

module.exports = {
  entry: './js/index.js',

  module: {
    rules: [
      {
        test: /\.js$/,
        loader: 'babel-loader'
      }
    ]
  },

  plugins: [
    new webpack.ProvidePlugin({
      Promise: 'es6-promise'          <-- here
    })
  ]
};

Q: , Promise - , -? ES5 es6? ?

---

jquery plugin/tool/lib, babel ...

webpack.config.js - babel-plugin-transform-runtime

module.exports = {
  entry: {
    foo: [
      './js/start.js'
    ]
  },

  module: {
    rules: [
      {
        test: /\.js$/,
        loader: 'babel-loader'
      }
    ]
  }
}

.babelrc

{
  "presets": [ "es2015" ],
  "plugins": ["transform-runtime"]     <--here
}

start.js

require('babel-runtime/core-js/promise').default = require('es6-promise');  <--here
require('plugin');

Q: es6- babel-runtime , ?

Answer 1

Polyfill webpack

entry: ['core-js/fn/promise', './index.js']

, .

, polyfill ?

, polyfill Promise. polyfill , , . API, , Ponyfills.

Webpack ProvidePlugin

new webpack.ProvidePlugin({
  Promise: 'es6-promise'
})

ProvidePlugin , , . A - , . .

, Promise, webpack :

var Promise = require('es6-promise');

, Promise - , -?

, ProvidePlugin webpack, , webpack.

ES5 es6?

, webpack, .

?

Promise , . es6-promise, , , Auto-polyfill.

Babel

{
  "plugins": ["transform-runtime"]
}

babel-plugin-transform-runtime core-js , Promise. , , core-js Promise. , babel , , core-js/library, core-js README. :

const Promise = require('core-js/library/fn/promise');

core-js Promise Promise . . babel-plugin-transform-runtime - core-js aliasing. , webpack ProvidePlugin, , babel , .

es6- babel-runtime , ?

, . Babel JavaScript JavaScript, ES5. JavaScript, , ES5 .

require('babel-runtime/core-js/promise').default = require('es6-promise');

, es6-promise. , ES . Babel . . ES-.

---

?

, . , , , . , runel transform runtime , babel, webpack.

None.

polyfill . , , , , polyfill. , Promises , , , , . , , /. , Promise String.prototype.trimLeft.

. , - , (, webpack, eslint ..). , , , . , , , Node , , package.json engines.

- . , webpack , , jQuery -, (, , ). , , . , . , webpack Node verions >= 4.3.0, .