Skip to main content

注意事项

Polyfills

为了使某些功能起作用,它们需要某些 polyfill。你可以通过使用完整的 polyfill(例如 core-js/actual 或(如果你想使用 <script> 标签加载它)core-js-bundle)来满足所有 Babel 功能要求。

¥In order for certain features to work they require certain polyfills. You can satisfy all Babel feature requirements by using a complete polyfill such as core-js/actual or (if you want to load it using a <script> tag) core-js-bundle.

你可以选择/选择性地包括你需要的内容:

¥You may alternatively/selectively include what you need:

特性要求
数组解构,For OfSymbol, prototype[Symbol.iterator]
传播Array.from

如果你将生成器或异步函数编译到 ES5,并且你使用的是早于 7.18.0@babel/core@babel/plugin-transform-regenerator 版本,则还必须加载 regenerator runtime 包。使用 @babel/preset-envuseBuiltIns: "usage" 选项或 @babel/plugin-transform-runtime 时会自动加载。

¥If you are compiling generators or async function to ES5, and you are using a version of @babel/core or @babel/plugin-transform-regenerator older than 7.18.0, you must also load the regenerator runtime package. It is automatically loaded when using @babel/preset-env's useBuiltIns: "usage" option or @babel/plugin-transform-runtime.

内置

¥Built-ins

Babel 假设内置插件(例如 ArrayWeakMap 和其他),如果是 polyfill,则以符合规范的方式进行修改。

¥Babel assumes that built-ins (e.g. Array, WeakMap and others), if polyfilled, are modified in a manner that is spec-compliant.

¥Classes

由于 ES5 的限制(对于 transform-classes 插件),DateArrayDOM 等内置类无法正确子类化。你可以尝试在 Object.setPrototypeOfReflect.construct 的基础上使用 babel-plugin-transform-builtin-extend,但它也有一些限制。

¥Built-in classes such as Date, Array, DOM etc cannot be properly subclassed due to limitations in ES5 (for the transform-classes plugin). You can try to use babel-plugin-transform-builtin-extend based on Object.setPrototypeOf and Reflect.construct, but it also has some limitations.

ES5

由于 Babel 假设你的代码将在 ES5 环境中运行,因此它使用 ES5 函数。因此,如果你使用的环境对 ES5 的支持有限或不支持,例如较低版本的 IE,那么使用 @babel/polyfill 将增加对这些方法的支持。

¥Since Babel assumes that your code will run in an ES5 environment it uses ES5 functions. So if you're using an environment that has limited or no support for ES5 such as lower versions of IE then using @babel/polyfill will add support for these methods.

IE 浏览器

¥Internet Explorer

类(10 及以下)

¥Classes (10 and below)

如果你从一个类继承,那么静态属性是通过 proto 从它继承的,这得到了广泛的支持,但你可能会遇到更旧的浏览器的问题。

¥If you're inheriting from a class then static properties are inherited from it via proto, this is widely supported but you may run into problems with much older browsers.

注意:IE ≤ 10 不支持 __proto__,因此不会继承静态属性。有关可能的解决方法,请参阅 protoToAssign

¥NOTE: __proto__ is not supported on IE ≤ 10 so static properties will not be inherited. See the protoToAssign for a possible work around.

对于具有 super 的类,超类将无法正确解析。你可以通过启用 transform-classes 插件中的 loose 选项来解决此问题。

¥For classes that have supers, the super class won't resolve correctly. You can get around this by enabling the loose option in the transform-classes plugin.

getter/setter(8 及以下)

¥Getters/setters (8 and below)

在 IE8 中,Object.defineProperty 只能用于 DOM 对象。这是不幸的,因为它需要设置 getter 和 setter。因此,如果你计划支持 IE8 或更低版本,则不建议使用 getter 和 setter。

¥In IE8 Object.defineProperty can only be used on DOM objects. This is unfortunate as it's required to set getters and setters. Due to this if you plan on supporting IE8 or below then the usage of getters and setters isn't recommended.

参考:MDN

¥Reference: MDN.

模块

¥Modules

默认情况下,当使用带有 Babel 的模块时,会导出一个不可枚举的 __esModule 属性。这是通过使用 IE8 及更低版本不支持的 Object.defineProperty 来完成的。解决方法是在相应的模块插件中启用 loose 选项。

¥By default, when using modules with Babel a non-enumerable __esModule property is exported. This is done through the use of Object.defineProperty which is unsupported in IE8 and below. A workaround for this is to enable the loose option in your corresponding module plugin.