The babel-polyfill and babel-runtime modules are sued to serve the same function in two different ways. Both modules ultimately serve to emulate an ES6 environment.

Both babel-polyfill and babel-runtime emulate an ES6 environment with two things:

  • a slew of polyfills as provided by core-js

  • complete generator runtime

babel-polyfill accomplishes this task by assigning methods on the global or on native type prototypes which means that once required, as far as the javascript runtime you’re using is concerned, ES6 methods and object simply exist. If you were to require babel-polyfill in a script run under node v0.1.0 – a runtime which does not natively support the Promise API – your script would then have access to the Promise object. As far as you are concerned, you’re suddenly using an environment that support the Promise object.

babel-runtime does something very similar, but in a way that does not pollute native object prototypes or the global namespace. Instead, babel-runtime is a module that you can list as a dependency of your application like any other module, which polyfills ES6 methods. In other words and continuing the example from above, while you may not have the Promise object available to you, you now have the same functionality available to you from require('babel-runtime/core-js/promise'). By itself, this is useful but inconvenient. Fortunately, babel-runtime is not intended to be used by itself. Rather, babel-runtime is intended to be paired with the transform – babel-plugin-transform-runtime – which will automatically rewrite your code such that you can write your code using the Promise API and it will be transformed to use the Promise-like object exported by babel-runtime

babel-polyfill offers you the conveniences of gloablly defined objects without having to transform your code further. However, as with anything that mutates a global, this can introduce collision between versions, etc.

babel-runtime, on the other hand, will not suffer from collision as everything is name-spcaed. Since the module will be defined in your package.json, it can be versioned like everything else. The tradeoff, however, is that a transform can only do so much. The runtime remaps methods according to a definitions map. Anecdotally, this has covered each of my use-cases but there may be an obscure method or two which is not remapped. There are also certain cases where your intent is ambiguous. In such cases, the transform won’t know exactly what to do.

Conclusion

To summarize, with the general case for Babel 6, there are two main steps you’ll need to perform:

  • Provide your code with an emulated ES6 environment by either requiring babel-polyfill or requiring the babel-runtime module plus the babel-plugin-transform-runtime transform:
1
2
3
4
// for babel-polyfill, either add:
require('babel-polyfill')

// for babel-runtime, install the module, then use the babel-plugin-transform-runtime transform by including it in your .babelrc file.