我应将哪些Babel变压器列入Chrome应用的黑名单？

Question

I'm writing ES6+ code and compiling it with Babel (currently using {stage: 0} as my .babelrc config).

So I'm compiling everything right down to ES5. But I'm exlusively targeting Chrome v47+, which supports some ES6+ features natively.

Which of the default Babel transformers can I blacklist (disable) and still have my code run in Chrome 47+?

Answer 1

Available ES6+ Functionality

Take a look at this page to see what features are fully implemented and enabled by default in Chrome and this page for the Babel transformers to which they correspond.

ES6 Feature             Release   Babel Transformer                   Spec. Compliant*
--------------------------------------------------------------------------------------
Rest Parameters        | 47      | es6.parameters                    | ✔
Spread                 | 46      | es6.spread                        | ✔
Arrow Functions        | 45      | es6.arrowFunctions                | ✔
Extended Obj. Literals | 45      | es6.properties.shorthand/computed | ✘
Computed Prop. Names   | 44      | es6.properties.shorthand/computed | ✘
Classes                | 42      | es6.classes                       | ✘
Template Strings       | 41      | es6.templateLiterals              | ✘
Generators             | 39      | regenerator                       | ✘
JS iterators           | 38      | es6.forOf                         | ✘
Block bindings         | 18      | es6.blockScoping/constants        | ✘

*I have derived the column Spec. Compliant (re: Chrome not Babel) by looking at what draft of the specification the current implementation is based. For example 'Editor's Draft' -- I assume this means a potentially incomplete or incorrect implementation.

______

Babel Transformer Dependencies

These are the dependencies that transformers have on each other that I have identified from the Babel source code:

Transformer               Dependencies
--------------------------------------------
es7.classProperties      | es6.classes
es7.decorators           | es6.classes
es7.asyncFunctions       | es6.classes
es7.objectRestSpread     | es6.destructuring

______

Conclusion

It seems that no ES6 Babel transformer is dependent on another. So, any ES6 feature that is implemented in Chrome, and is spec. compliant , you no longer need to rely on Babel for. And these are: es6.parameters , es6.spread , and es6.arrowFunctions .

Answer 2

It's currently not quite as simple as disabling transformers for features the environment supports, because some transformers have dependencies on others. For example, the es7.asyncFunctions transformer depends on es6.classes , even for environments where classes are natively supported. By "depends", I don't mean that es7.asyncFunctions automatically invokes es6.classes , I mean that es6.classes has to be individually enabled (either explicitly or by not being blacklisted). See babel/babel#2415 .

Possibly also of interest: babel/babel#2340 .