Babel无法使用传播算子编译ES6对象克隆

Question

我使用grunt-babel编译我的ES6代码。 但它返回Warning: dist/app.js: Unexpected token (321:9) Use --force to continue. 当我尝试使用{...obj}复制和扩展对象时。 以下代码在Chrome v61的控制台中运行完美，但是Babel不喜欢它。 问题是什么？

let a = { a: 12 };
let b = { ...a, b: 15 };

我使用的ENV预设。 （ babel-core v.6.26.0和babel-preset-env v.1.6.1 ）

Answer 1

对象的传播属性不是ES6的一部分。 目前，截至2017年12月，它是ECMAScript第三阶段提案的一部分。 您可以在这里查看提案 。

您需要一个babel预设，其中包括尚未正式使用该语言的功能。 babel-preset-env不包含这些功能。

为了解决您的问题，您可以使用babel-preset-stage-3之类的东西 ，并将“ stage-3”添加到.babelrc中的预设列表中。

边注：

ES6中对象的传播语法的替代方法是使用Object.assign

let b = Object.assign({}, a, { b: 15 });

Answer 2

您可能希望将这些插件添加到.babelrc 。 这个Github问题有很多解决方案意外的令牌（剩余散布算子） 。 我现在正在尝试这些。

{
  "presets": ["react", "es2015"],
  "plugins": ["transform-es2015-destructuring", "transform-object-rest-spread"]
}

npm install --save-dev babel-plugin-transform-es2015-destructuring

npm install --save-dev babel-plugin-transform-object-rest-spread