检测ES2015代码是由babel编译还是在本地运行？

Question

Due to certain limitations in babel's operation, I need to write workaround code to make part of my project work correctly when transpiled by it. I would like to make this code conditional, so it only runs if it has been transpiled by babel (as it is unnecessary in a native ES6 environment). Is there any way of doing this?

Answer 1

From Babel plugins docs :

Now, out of the box Babel doesn't do anything. It basically acts like const babel = code => code; by parsing the code and then generating the same code back out again.

So generally you can't detect if a code has been transpiled by Babel, because without any plugins, it's no-op. However, you might be able to detect if code has been transipled with Babel with some plugins or presets.

Since you're talking about transpiling ES2015 code, I assume that you're using the es2015 preset. This preset for example transpiles ES2015 classes. Since you can easily detect if something is a native ES2015 class , you can check if a code has been transipiled by Babel.

For example, the following code snippet in modern browsers should output false :

 const isBabel = !(class {}.toString().indexOf('class ') === 0); console.log(isBabel); 

While this one outputs true (I checked the "Use BabelJS / ES2015" option in code snippet options):

 const isBabel = !(class {}.toString().indexOf('class ') === 0); console.log(isBabel);