global promise polyfill是如何在WebPackV2中实现的？

Question

我想更好地理解webpack中如何实现promise之间的区别。通常情况下，由于我主要开发应用程序，幸灾乐祸的无知足以应付，但我对如何正确地开发一个插件/工具/库显然有点困惑。

js-使用babel-polyfill作为入口点

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

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

问：在这种方法中，因为它是一种聚填料，所以它改变了全球前景？

使用提供插件的webpack配置填充

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

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

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

问：这是否意味着Promise是一个只特定于webpack捆绑过程的模块？传输的ES5代码是否有本地副本或ES6-promise？它是否弥补了全球promise？

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

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

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

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

问：这将es6-promise别名为babel-runtime promise,并且不是全局的,只是工具的局部？

Answer 1

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

这与您在入口点的顶部导入它具有相同的效果。

在这种方法中，由于它是一种聚合体，它改变了全球前景？

是的，此polyfill更改全局promise。称它为polyfill通常意味着它修补了全局内置，尽管这一点并没有严格遵守。如果它们不改变现有的API，而只提供功能，它们有时被称为PonyFills。

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

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

传输的ES5代码是否有本地副本或ES6-promise？

与任何其他模块一样，它被webpack包含一次，所有导入都引用该模块。

它是否弥补了全球promise？

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

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

它不是全局的，因为它只是一个模块。Babel获取JavaScript并输出一些其他JavaScript，在这些JavaScript中将配置的特性传输到ES5。您将运行或捆绑得到的JavaScript，它实际上与您最初编写ES5的情况相同。

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

然后修改导出，因此模块将使用es6-promise。但是覆盖导出不是一个好主意，特别是因为ES模块的导入在规范中是不可变的。Babel目前在这方面不符合规范。有关更多细节，请参见使transpiled ES模块更符合规范。

这取决于你在做什么。除了它们是否改变全局的区别之外，你可以选择你喜欢的任何一个。例如，使用babel的transform runtime允许您将它与任何使用babel的工具一起使用，而不仅仅是WebPack。

插件是一个非常宽泛的术语，可以是介于库和应用之间的任何东西。例如，webpack插件或加载器应该按原样工作，而jQuery插件将是web应用程序的一部分，您应该将其视为库（它们可能应该被称为库而不是plugin）。通常，您希望与所扩展的任何内容的指导原则相匹配。看一看，看看他们的目标是什么。例如，webpack当前支持Node verions>=4.3.0，所以您的插件也应该支持。