Skip to main content

升级到 Babel 7

升级到 Babel 7 时请参考此文档。检查 此处 以了解 API/集成更改。

¥Refer users to this document when upgrading to Babel 7. Check here for API/integration changes.

因为不是每个重大更改都会影响每个项目,所以我们在升级时按照更改破坏测试的可能性对这些部分进行了排序。

¥Because not every breaking change will affect every project, we've sorted the sections by the likelihood of a change breaking tests when upgrading.

Babel

已放弃对 Node.js 0.10、0.12、4 和 5 的支持 #5025#5041#7755#5186

¥Support for Node.js 0.10, 0.12, 4 and 5 has been dropped #5025, #5041, #7755, #5186

我们强烈建议你使用较新版本的 Node.js (LTS v8),因为不维护以前的版本。有关详细信息,请参阅 nodejs/LTS

¥We highly encourage you to use a newer version of Node.js (LTS v8) since the previous versions are not maintained. See nodejs/LTS for more information.

这只是意味着 Babel 本身不会在旧版本的 Node.js 上运行。它仍然可以输出在旧 Node 版本上运行的代码。

¥This just means Babel itself won't run on older versions of Node. It can still output code that runs on old Node versions.

配置查找更改

¥Config Lookup Changes

欲了解更多信息,请阅读我们的 6.x 与 7.x 比较

¥For more info, read our 6.x vs 7.x comparison.

Babel 之前在处理 node_modules、符号链接和大仓时遇到过问题。为了解决这个问题,我们进行了一些更改:Babel 将在 package.json 边界停止查找,而不是查找链。对于大仓,我们添加了一个新的 babel.config.js 文件,该文件将我们的配置集中在所有包中(或者你可以为每个包创建一个配置)。在 7.1 中,我们引入了 rootMode 选项,以便在必要时进一步查找。

¥Babel has had issues previously with handling node_modules, symlinks, and monorepos. We've made some changes to account for this: Babel will stop lookup at the package.json boundary instead of looking up the chain. For monorepos we have added a new babel.config.js file that centralizes our config across all the packages (alternatively you could make a config per package). In 7.1, we've introduced a rootMode option for further lookup if necessary.

每年预设弃用

¥Yearly Preset Deprecations

"env" 预设已经推出一年多了,它完全取代了我们之前拥有和建议的一些预设。

¥The "env" preset has been out for more than a year now, and completely replaces some of the presets we've had and suggested earlier.

  • babel-preset-es2015

  • babel-preset-es2016

  • babel-preset-es2017

  • babel-preset-latest

  • 以上的组合^

    ¥A combination of the above ^

这些预设应替换为 "env" 预设。

¥These presets should be substituted with the "env" preset.

阶段预设弃用

¥Stage Preset Deprecations

我们正在删除阶段预设,以支持明确的提案使用。可以查看 stage-0 自述文件 了解更多迁移步骤。

¥We are removing the stage presets in favor of explicit proposal usage. Can check the stage-0 README for more migration steps.

要自动执行此操作,你可以运行 npx babel-upgrade(PR 添加了 此处)。

¥To do this automatically you can run npx babel-upgrade (PR added here).

删除 @babel/polyfill 中的提案 polyfill

¥Remove proposal polyfills in @babel/polyfill

基于类似的想法,我们从 @babel/polyfill 中删除了 polyfill 提案。

¥Based on similar thinking, we have removed the polyfill proposals from @babel/polyfill.

现在 @babel/polyfill 大多只是 core-js v2 的别名。来源

¥Right now @babel/polyfill is mostly just an alias of core-js v2. Source

在它曾经只有 2 个导入之前:

¥Before it used to just be 2 imports:

JavaScript
import "core-js/shim"; // included < Stage 4 proposals
import "regenerator-runtime/runtime";

如果你想使用提案,则需要单独导入这些提案。你应该直接从 core-js 包或 npm 上的其他包导入它们。

¥If you want to use proposals, you will need to import these independently. You should import them directly from the core-js package or another package on npm.

例如

¥e.g.

JavaScript
// for core-js v2:
import "core-js/fn/array/flat-map";

// for core-js v3:
import "core-js/features/array/flat-map";

以下是 core-js v2 中的 Stage < 3 提案 polyfill 的列表。

¥Below is a list of Stage < 3 proposal polyfills in core-js v2.

Details
JavaScript
// core-js v2

// Stage 3
import "core-js/fn/string/trim-left";
import "core-js/fn/string/trim-right";
import "core-js/fn/string/match-all";
import "core-js/fn/array/flat-map";
import "core-js/fn/array/flatten"; // RENAMED
import "core-js/fn/global";

// Stage 1
import "core-js/fn/symbol/observable";
import "core-js/fn/promise/try";
import "core-js/fn/observable";

// Stage 1 Math Extensions
import "core-js/fn/math/clamp";
import "core-js/fn/math/deg-per-rad";
import "core-js/fn/math/degrees";
import "core-js/fn/math/fscale";
import "core-js/fn/math/iaddh";
import "core-js/fn/math/isubh";
import "core-js/fn/math/imulh";
import "core-js/fn/math/rad-per-deg";
import "core-js/fn/math/radians";
import "core-js/fn/math/scale";
import "core-js/fn/math/umulh";
import "core-js/fn/math/signbit";

// Stage 1 "of and from on collection constructors"
import "core-js/fn/map/of";
import "core-js/fn/set/of";
import "core-js/fn/weak-map/of";
import "core-js/fn/weak-set/of";
import "core-js/fn/map/from";
import "core-js/fn/set/from";
import "core-js/fn/weak-map/from";
import "core-js/fn/weak-set/from";

// Stage 0
import "core-js/fn/string/at";

// Nonstandard
import "core-js/fn/object/define-getter";
import "core-js/fn/object/define-setter";
import "core-js/fn/object/lookup-getter";
import "core-js/fn/object/lookup-setter";
// import "core-js/fn/map/to-json"; // Not available standalone
// import "core-js/fn/set/to-json"; // Not available standalone

import "core-js/fn/system/global";
import "core-js/fn/error/is-error";
import "core-js/fn/asap";

// Decorator metadata? Not sure of stage/proposal
import "core-js/fn/reflect/define-metadata";
import "core-js/fn/reflect/delete-metadata";
import "core-js/fn/reflect/get-metadata";
import "core-js/fn/reflect/get-metadata-keys";
import "core-js/fn/reflect/get-own-metadata";
import "core-js/fn/reflect/get-own-metadata-keys";
import "core-js/fn/reflect/has-metadata";
import "core-js/fn/reflect/has-own-metadata";
import "core-js/fn/reflect/metadata";

版本控制/依赖

¥Versioning/Dependencies

大多数插件/顶层包现在在 @babel/core 上有一个 peerDependency

¥Most plugins/top level packages now have a peerDependency on @babel/core.

包重命名

¥Package Renames

  • babylon 现在是 @babel/parser

    ¥babylon is now @babel/parser

你仍然可以在配置中使用包名的简写版本(删除 preset-plugin-),但为了清楚起见,我选择使用整个包名(也许我们应该删除它,因为它不会节省很多键入)。

¥You can still use the shorthand version of a package name (remove the preset- or plugin-) in the config, but I'm choosing to use the whole package name for clarity (maybe we should just remove that, given it doesn't save that much typing anyway).

{
- "presets": ["@babel/preset-react"],
+ "presets": ["@babel/react"], // this is equivalent
- "plugins": ["@babel/transform-runtime"],
+ "plugins": ["@babel/plugin-transform-runtime"], // same
}

范围包

¥Scoped Packages

最重要的变化是最后将所有包切换到 范围包大仓 中的文件夹名称没有改变,但它的 package.json 中的名称是)。

¥The most important change is finally switching all packages to scoped packages (the folder names in the monorepo are not changed but the name in its package.json is).

这意味着不会再出现意外/故意的域名抢注、与社区插件明确分离以及更简单的命名约定的问题。

¥This means there will be no more issues with accidental/intentional name squatting, a clear separation from community plugins, and a simpler naming convention.

你的依赖需要像这样修改:

¥Your dependencies will need to be modified like so:

babel-cli -> @babel/cli。对我们来说,我们基本上是从用 @babel/ 替换 babel- 开始的。

¥babel-cli -> @babel/cli. For us, we basically started by replacing babel- with @babel/.

在配置中使用

¥Use in the config

你仍然可以使用指定预设或插件的简写方式。但是,由于切换到范围包,你仍然必须指定 @babel/,就像你将自己的预设添加到配置中一样。

¥You can still use the shorthand way of specifying a preset or plugin. However because of the switch to scoped packages, you still have to specify the @babel/ just like if you had your own preset to add to the config.

babel.config.js
module.exports = {
presets: ["@babel/env"], // "@babel/preset-env"
plugins: ["@babel/transform-arrow-functions"], // same as "@babel/plugin-transform-arrow-functions"
};

TC39 提案切换到 -proposal-

¥Switch to -proposal- for TC39 Proposals

这意味着任何不在年度版本中的插件(ES2015、ES2016 等)都应该重命名为 -proposal。这样我们就可以更好地表明提案不是在 JavaScript 中正式发布的。

¥This means any plugin that isn't in a yearly release (ES2015, ES2016, etc) should be renamed to -proposal. This is so we can better signify that a proposal isn't officially in JavaScript.

示例:

¥Examples:

  • @babel/plugin-transform-function-bind 现在是 @babel/plugin-proposal-function-bind(阶段 0)

    ¥@babel/plugin-transform-function-bind is now @babel/plugin-proposal-function-bind (Stage 0)

  • @babel/plugin-transform-class-properties 现在是 @babel/plugin-proposal-class-properties(第 3 阶段)

    ¥@babel/plugin-transform-class-properties is now @babel/plugin-proposal-class-properties (Stage 3)

这也意味着当提案进入第 4 阶段时,我们应该重命名包。

¥This also means that when a proposal moves to Stage 4, we should rename the package.

从包名称中删除年份

¥Remove the year from package names

一些插件的名称中有 -es3--es2015-,但这些都是不必要的。

¥Some of the plugins had -es3- or -es2015- in the names, but these were unnecessary.

@babel/plugin-transform-es2015-classes 变成了 @babel/plugin-transform-classes

¥@babel/plugin-transform-es2015-classes became @babel/plugin-transform-classes.

CommonJS 中的 "use strict"this

¥"use strict" and this in CommonJS

Babel 6 对 ES6 模块的转换不加选择地在它被告知要处理的任何文件上运行,从不考虑文件中是否真的有 ES6 导入/导出。这具有将对 this 的文件范围引用重写为 undefined 并在 Babel 处理的所有 CommonJS 模块的顶部插入 "use strict" 的效果。

¥Babel 6's transformations for ES6 modules ran indiscriminately on whatever files it was told to process, never taking into account if the file actually had ES6 imports/exports in them. This had the effect of rewriting file-scoped references to this to be undefined and inserting "use strict" at the top of all CommonJS modules that were processed by Babel.

JavaScript
// input.js
this;
JavaScript
// output.js v6
"use strict"; // assumed strict modules
undefined; // changed this to undefined
JavaScript
// output.js v7
this;

这种行为在 Babel 7 中受到限制,因此对于 transform-es2015-modules-commonjs 转换,文件只有在文件中有 ES6 导入或导出时才会更改。(编者注:如果我们登陆 https://github.com/babel/babel/issues/6242,这可能会再次改变,因此我们希望在发布之前重新审视这一点)。

¥This behavior has been restricted in Babel 7 so that for the transform-es2015-modules-commonjs transform, the file is only changed if it has ES6 imports or exports in the file. (Editor's note: This may change again if we land https://github.com/babel/babel/issues/6242, so we'll want to revisit this before publishing).

JavaScript
// input2.js
import "a";
JavaScript
// output.js v6 and v7
"use strict";
require("a");

如果你依赖 Babel 自动将 "use strict" 注入到所有 CommonJS 模块中,你将需要在 Babel 配置中显式使用 transform-strict-mode 插件。

¥If you were relying on Babel to inject "use strict" into all of your CommonJS modules automatically, you'll want to explicitly use the transform-strict-mode plugin in your Babel config.

React 和 Flow 预设的分离

¥Separation of the React and Flow presets

babel-preset-react 一直包含 flow 插件。这导致了很多用户由于拼写错误而无意中使用了 flow 语法,或者在没有对 flow 本身进行类型检查的情况下添加它,从而导致错误。

¥babel-preset-react has always included the flow plugin. This has caused a lot of issues with users that accidentally use flow syntax unintentionally due to a typo, or adding it in without typechecking with flow itself, resulting in errors.

当我们决定支持 TypeScript 时,这个问题变得更加复杂。如果你想使用 React 和 TypeScript 预设,我们必须想办法通过文件类型或指令自动打开/关闭语法。最后,更容易完全分离预设。

¥This issue was compounded when we decided to support TypeScript. If you wanted to use the React and TypeScript presets, we would have to figure out a way to turn on/off the syntax, automatically, via file type or the directive. In the end, it was easier to separate the presets entirely.

Presets 使 Babel 能够解析 Flow / TypeScript(和其他方言 / 语言)提供的类型,然后在编译为 JavaScript 时将它们剥离。

¥Presets enable Babel to parse types provided by Flow / TypeScript (and other dialects / languages), then strip them out when compiling down to JavaScript.

{
- "presets": ["@babel/preset-react"]
+ "presets": ["@babel/preset-react", "@babel/preset-flow"] // parse & remove flow types
+ "presets": ["@babel/preset-react", "@babel/preset-typescript"] // parse & remove typescript types
}

选项解析

¥Option parsing

Babel 的配置选项比 Babel 6 更严格。其中以逗号分隔的预设列表,例如 "presets": 'es2015, es2016' 以前在技术上可以工作,现在它会失败,需要更改为数组 #5463

¥Babel's config options are stricter than in Babel 6. Where a comma-separated list for presets, e.g. "presets": 'es2015, es2016' technically worked before, it will now fail and needs to be changed to an array #5463.

请注意,这不适用于 CLI,其中 --presets es2015,es2016 肯定仍然可以工作。

¥Note this does not apply to the CLI, where --presets es2015,es2016 will certainly still work.

{
- "presets": "@babel/preset-env, @babel/preset-react"
+ "presets": ["@babel/preset-env", "@babel/preset-react"]
}

插件/预设导出

¥Plugin/Preset Exports

所有插件/预设现在应该导出一个函数而不是一个对象以保持一致性(通过 babel/babel#6494)。这将帮助我们进行缓存。

¥All plugins/presets should now export a function rather than an object for consistency (via babel/babel#6494). This will help us with caching.

解析基于字符串的配置值

¥Resolving string-based config values

在 Babel 6 中,直接传递给 Babel 的值(不是来自配置文件)是相对于正在编译的文件进行解析的,这导致了很多混乱。

¥In Babel 6, values passed to Babel directly (not from a config file), were resolved relative to the files being compiled, which led to lots of confusion.

在 Babel 7 中,值的解析要么相对于加载它们的配置文件,要么相对于工作目录。

¥In Babel 7, values are resolved consistently either relative to the config file that loaded them, or relative to the working directory.

对于 presetsplugins 值,此更改意味着 CLI 在以下情况下会表现良好

¥For presets and plugins values, this change means that the CLI will behave nicely in cases such as

Shell
babel --presets @babel/preset-env ../file.js

假设你的 node_modules 文件夹在 . 中,在 Babel 6 中这将失败,因为找不到预设。

¥Assuming your node_modules folder is in ., in Babel 6 this would fail because the preset could not be found.

此更改还会影响 onlyignore,这将在接下来进行扩展。

¥This change also affects only and ignore which will be expanded on next.

基于路径的 onlyignore 模式

¥Path-based only and ignore patterns

在 Babel 6 中,onlyignore 被视为一般匹配字符串,而不是文件路径 glob。这意味着例如 *.foo.js 将匹配 ./**/*.foo.js,这让大多数用户感到困惑和惊讶。

¥In Babel 6, only and ignore were treated as a general matching string, rather than a filepath glob. This meant that for instance *.foo.js would match ./**/*.foo.js, which was confusing and surprising to most users.

在 Babel 7 中,这些现在被视为基于路径的通配符模式,可以是相对路径或绝对路径。这意味着如果你正在使用这些模式,你现在可能至少需要为它们添加一个 **/ 前缀,以确保你的模式与目录深度匹配。

¥In Babel 7, these are now treated as path-based glob patterns which can either be relative or absolute paths. This means that if you were using these patterns, you'll probably need to at least add a **/ prefix to them now to ensure that your patterns match deeply into directories.

onlyignore 模式仍然适用于目录,因此你也可以使用 only: './tests' 只编译 tests 目录中的文件,而无需使用 **/*.js 来匹配所有嵌套文件。

¥only and ignore patterns do still also work for directories, so you could also use only: './tests' to only compile files in your tests directory, with no need to use **/*.js to match all nested files.

Babel 的 CLI 命令

¥Babel's CLI commands

babel 命令的 --copy-files 参数,它告诉 Babel 复制 Babel 不知道如何处理的目录中的所有文件,现在也将复制未通过 only/ignore 检查的文件,在此之前它会静默跳过所有被忽略的文件.

¥The --copy-files argument for the babel command, which tells Babel to copy all files in a directory that Babel doesn't know how to handle, will also now copy files that failed an only/ignore check, where before it would silently skip all ignored files.

@babel/node

Babel 6 中的 babel-node 命令是 babel-cli 包的一部分。在 Babel 7 中,这个命令已经被拆分成它自己的 @babel/node 包,所以如果你使用这个命令,你会想要添加这个新的依赖。

¥The babel-node command in Babel 6 was part of the babel-cli package. In Babel 7, this command has been split out into its own @babel/node package, so if you are using that command, you'll want to add this new dependency.

@babel/runtime, @babel/plugin-transform-runtime

我们在运行时将 Babel 的助手从它的 "polyfilling" 行为中分离出来。PR 中有更多细节。

¥We have separated out Babel's helpers from its "polyfilling" behavior in runtime. More details in the PR.

@babel/runtime 现在只包含助手,如果你需要 core-js,你可以使用 @babel/runtime-corejs2 和转换中提供的选项。对于两者,你仍然需要 @babel/plugin-transform-runtime

¥@babel/runtime now only contains the helpers, and if you need core-js you can use @babel/runtime-corejs2 and the option provided in the transform. For both you still need the @babel/plugin-transform-runtime

只有帮手

¥Only Helpers

Shell
# install the runtime as a dependency
npm install @babel/runtime
# install the plugin as a devDependency
npm install @babel/plugin-transform-runtime --save-dev
babel.config.json
{
"plugins": ["@babel/plugin-transform-runtime"]
}

来自 core-js 的助手 + polyfilling

¥Helpers + polyfilling from core-js

因此,如果你需要 transform-runtime 支持 core-js,你现在将传递 corejs 选项并使用 @babel/runtime-corejs2 依赖而不是 @babel/runtime

¥So if you need core-js support with transform-runtime, you would now pass the corejs option and use the @babel/runtime-corejs2 dependency instead of @babel/runtime.

Shell
# install the runtime as a dependency
npm install @babel/runtime-corejs2
# install the plugin as a devDependency
npm install @babel/plugin-transform-runtime --save-dev
{
"plugins": [
- ["@babel/plugin-transform-runtime"],
+ ["@babel/plugin-transform-runtime", {
+ "corejs": 2,
+ }],
]
}

规范合规性

¥Spec Compliancy

@babel/plugin-proposal-object-rest-spread

对象 #290 中的 RestElement 之后不能有尾随逗号

¥A trailing comma cannot come after a RestElement in objects #290

medium

var {
- ...y, // trailing comma is a SyntaxError
+ ...y
} = { a: 1 };

由于 Object Spread 定义了新的属性,而 Object.assign 只是设置了它们,Babel 更改了默认行为以更加符合规范。

¥Since Object Spread defines new properties and Object.assign just sets them, Babel has changed the default behavior to be more spec compliant.

JavaScript
// input
z = { x, ...y };
JavaScript
// v7 default behavior: ["proposal-object-rest-spread"]
function _objectSpread(target) { ... }

z = _objectSpread({
x
}, y);
JavaScript
// Old v6 behavior: ["proposal-object-rest-spread", { "loose": true }]
function _extends(target) { ... }

z = _extends({
x
}, y);
JavaScript
// Substitute for Object.assign: ["proposal-object-rest-spread", { "loose": true, "useBuiltIns": true }]
z = Object.assign(
{
x,
},
y
);

@babel/plugin-proposal-class-properties

默认行为更改为以前的默认行为 "spec"

¥The default behavior is changed to what was previously "spec" by default

JavaScript
// input
class Bork {
static a = "foo";
y;
}
JavaScript
// v7 default behavior: ["@babel/plugin-proposal-class-properties"]
var Bork = function Bork() {
Object.defineProperty(this, "y", {
enumerable: true,
writable: true,
value: void 0,
});
};

Object.defineProperty(Bork, "a", {
enumerable: true,
writable: true,
value: "foo",
});
JavaScript
// old v6 behavior: ["@babel/plugin-proposal-class-properties", { "loose": true }]
var Bork = function Bork() {
this.y = void 0;
};

Bork.a = "foo";

@babel/plugin-transform-export-extensions 拆分为两个重命名的提案

¥Split @babel/plugin-transform-export-extensions into the two renamed proposals

这是一个很长的时间,但最终改变了。

¥This is a long time coming but this was finally changed.

@babel/plugin-proposal-export-default-from

JavaScript
export v from "mod";

@babel/plugin-proposal-export-namespace-from

JavaScript
export * as ns from "mod";

@babel/plugin-transform-template-literals

模板字面量修订版已更新 #5523

¥Template Literals Revision updated #5523

low

参见 模板字面量修订 的提案。

¥See the proposal for Template Literals Revision.

它导致 Babel 6 抛出 Bad character escape sequence (5:6)

¥It causes Babel 6 to throw Bad character escape sequence (5:6).

JavaScript
tag`\unicode and \u{55}`;

这已在 Babel 7 中修复,并生成如下内容:

¥This has been fixed in Babel 7 and generates something like the following:

JavaScript
// default
function _taggedTemplateLiteral(strings, raw) {
return Object.freeze(
Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })
);
}
var _templateObject = /*#__PURE__*/ _taggedTemplateLiteral(
[void 0],
["\\unicode and \\u{55}"]
);
tag(_templateObject);
JavaScript
// loose mode
function _taggedTemplateLiteralLoose(strings, raw) {
strings.raw = raw;
return strings;
}
var _templateObject = /*#__PURE__*/ _taggedTemplateLiteralLoose(
[void 0],
["\\unicode and \\u{55}"]
);
tag(_templateObject);

常规模板字面量默认为以前的 "spec" 模式

¥Default to previous "spec" mode for regular template literals

JavaScript
// input
`foo${bar}`;
JavaScript
// default v7 behavior: ["@babel/plugin-transform-template-literals"]
"foo".concat(bar);
JavaScript
// old v6 behavior: ["@babel/plugin-transform-template-literals", { "loose": true }]
"foo" + bar;

@babel/plugin-proposal-decorators

为期待新的装饰器提案实现,我们决定将其设为新的默认行为。这意味着要继续使用当前的装饰器语法/行为,你必须将 legacy 选项设置为 true

¥In anticipation of the new decorators proposal implementation, we've decided to make it the new default behavior. This means that to continue using the current decorators syntax/behavior, you must set the legacy option as true.

 {
"plugins": [
- "@babel/plugin-proposal-decorators"
+ ["@babel/plugin-proposal-decorators", { "legacy": true }]
]
}

注意:如果你使用包含此插件的 @babel/preset-stage-0@babel/preset-stage-1,则必须将 decoratorsLegacy 选项传递给它们。

¥NOTE: If you are using @babel/preset-stage-0 or @babel/preset-stage-1, which include this plugin, you must pass them the decoratorsLegacy option.

@babel/plugin-proposal-pipeline-operator

不断变化的新提案默认会出错,并要求每个人在事情仍处于 < 阶段 2 时选择特定提案。这在本 post 中有更多解释。

¥Newer proposals in flux will error by default and will require everyone to opt into a specific proposal while things are still < Stage 2. This is explained more in this post.

{
"plugins": [
- "@babel/plugin-proposal-pipeline-operator"
+ ["@babel/plugin-proposal-pipeline-operator", { "proposal": "minimal" }]
]
}

已删除 babel-plugin-transform-class-constructor-call

¥Removed babel-plugin-transform-class-constructor-call

babel-plugin-transform-class-constructor-call 已被删除 #5119

¥babel-plugin-transform-class-constructor-call has been removed #5119

low

TC39 决定放弃这个提议。你可以将逻辑移动到构造函数或静态方法中。

¥TC39 decided to drop this proposal. You can move your logic into the constructor or into a static method.

有关详细信息,请参阅 /docs/plugins/transform-class-constructor-call/

¥See /docs/plugins/transform-class-constructor-call/ for more information.

  class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}

- call constructor(x, y) {
+ static secondConstructor(x, y) {
return new Point(x, y);
}
}

let p1 = new Point(1, 2);
- let p2 = Point(3, 4);
+ let p2 = Point.secondConstructor(3, 4);

@babel/plugin-async-to-generator

我们将 babel-plugin-transform-async-to-module-method 合并到常规异步插件中,只是将其作为一个选项。

¥We merged babel-plugin-transform-async-to-module-method into the regular async plugin by just making it an option.

{
"plugins": [
- ["@babel/transform-async-to-module-method"]
+ ["@babel/transform-async-to-generator", {
+ "module": "bluebird",
+ "method": "coroutine"
+ }]
]
}

babel

删除 babel#5293

¥Dropping the babel package #5293

low

这个包目前给你一个错误信息,让你在 v6 中安装 babel-cli。我认为我们可以用这个名字做一些有趣的事情。

¥This package currently gives you an error message to install babel-cli instead in v6. I think we can do something interesting with this name though.

@babel/register

babel-core/register.js 已被删除 #5132

¥babel-core/register.js has been removed #5132

low

babel-core/register 的弃用用法已在 Babel 7 中删除;而是使用独立包 @babel/register

¥The deprecated usage of babel-core/register has been removed in Babel 7; instead use the standalone package @babel/register.

安装 @babel/register 作为新的依赖:

¥Install @babel/register as a new dependency:

npm install --save-dev @babel/register

用 Mocha 升级:

¥Upgrading with Mocha:

- mocha --require babel-core/register
+ mocha --require @babel/register

@babel/register 现在也只会直接编译当前工作中的文件(这样做是为了解决符号链接问题)。

¥@babel/register will also now only compile files in the current working directly (was done to fix issues with symlinking).

@babel/register 选项现在被替换而不是合并

¥@babel/register options are now replaced instead of merged

@babel/generator

删除 quotes 选项 #5154]

¥Dropping the quotes option #5154]

none

如果你想格式化编译输出,你可以使用 recast/prettier/escodegen/fork babel-generator。

¥If you want formatting for compiled output you can use recast/prettier/escodegen/fork babel-generator.

在我们公开 parserOptsgeneratorOpts 之前,此选项仅可通过 babel-generator 显式使用,直到 v6.18.0。因为那个版本中有一个错误,所以没有人应该在 Babel 本身中使用这个选项。

¥This option was only available through babel-generator explicitly until v6.18.0 when we exposed parserOpts and generatorOpts. Because there was a bug in that release, no one should've used this option in Babel itself.

删除 flowUsesCommas 选项 #5123

¥Dropping the flowUsesCommas option #5123

none

目前在 Flow 对象类型中有 2 种支持的语法(,;)。

¥Currently there are 2 supported syntaxes (, and ;) in Flow Object Types.

这个改变只是让 babel-generator 输出 , 而不是 ;

¥This change just makes babel-generator output , instead of ;.

@babel/core

删除 babel-core/src/api/browser.js #5124

¥Remove babel-core/src/api/browser.js #5124

none

babel-browser 已在 6.0 中删除。如果需要在浏览器或非 Node 环境中使用 Babel,请使用 @babel/standalone

¥babel-browser was already removed in 6.0. If you need to use Babel in the browser or a non-Node environment, use @babel/standalone.

Babel 将返回 filename 作为绝对路径 #8044

¥Babel will return filename as an absolute path #8044

@babel/preset-env

loose 模式现在将自动排除 typeof-symbol 变换(许多使用松散模式的项目都在这样做)。

¥loose mode will now automatically exclude the typeof-symbol transform (a lot of projects using loose mode were doing this).