What Babel transformers should I blacklist for a Chrome app?

Question

I am writing ES6 + code and compiling it using Babel (currently using {stage: 0} as my .babelrc configuration).

So, I collect everything, up to ES5. But I am exclusively targeting Chrome v47 +, which supports some ES6 + features natively.

Which of the standard water transformers can I lock (disable) and still have my code in Chrome 47+ ?

Answer 1

Available ES6 + features

Take a look at this page to find out which 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 got a Spec column. Relevant (re: Chrome is not Babel) by looking at which draft specification is based on the current implementation. For example, "Draft Editor" - I assume that this means a potentially incomplete or incorrect implementation.

______

Babel Transformer Dependencies

These are the dependencies that the transformers have on each other, which I 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 feature of ES6, which is implemented in Chrome, is a specification. , you no longer need to rely on Babel for. And these are: es6.parameters , es6.spread , and es6.arrowFunctions .

Answer 2

Currently, it is not as simple as turning off transformers for functions supported by the environment, because some transformers are dependent on others. For example, the es7.asyncFunctions transformer depends on es6.classes , even for environments in which classes are supported. By "depends" I do not mean that es7.asyncFunctions automatically calls es6.classes , I mean that es6.classes must be individually included (either explicitly or not blacklisted). See babel / babel # 2415 .

Perhaps also of interest: babel / babel # 2340 .