【问题标题】:SyntaxError on spread operator, while using babel env preset扩展运算符上的语法错误,同时使用 babel env 预设
【发布时间】:2018-06-12 10:58:55
【问题描述】:

我正在尝试通过将 babel es2015 和 stage-0 预设替换为 env 来“现代化”mern.io starter bolerplate。但是,env预设似乎无法识别client/modules/Intl/IntlReducer.js:9中的以下sn-p:

import { enabledLanguages, localizationData } from '../../../Intl/setup';
import { SWITCH_LANGUAGE } from './IntlActions';

const initLocale = global.navigator && global.navigator.language || 'en';

const initialState = {
  locale: initLocale,
  enabledLanguages,
  ...(localizationData[initLocale] || {}),
// ^ 
// SyntaxError: client/modules/Intl/IntlReducer.js: Unexpected token
};


const IntlReducer = (state = initialState, action) => {
  switch (action.type) {
    case SWITCH_LANGUAGE: {
      const { type, ...actionWithoutType } = action; // eslint-disable-line
      return { ...state, ...actionWithoutType };
    }

    default:
      return state;
  }
};

export default IntlReducer;

localizationData 对象填充到Intl/setup.js:56

这个扩展运算符对我来说似乎很正常,我无法发现语法错误。 此外,似乎该文件之前的其他代码正在被很好地转换,所以我猜 env 预设已正确应用。

这次失败的原因可能是什么?从 0 阶段到当前版本的 ES 是否不接受这种特殊风格的扩展运算符?我该如何进一步调查这个问题?

完整的错误信息(项目根路径被剥离):

node_modules/babel-core/lib/transformation/file/index.js:590
      throw err;
      ^

SyntaxError: client/modules/Intl/IntlReducer.js: Unexpected token (9:2)
   7 |   locale: initLocale,
   8 |   enabledLanguages,
>  9 |   ...localizationData[initLocale]
     |   ^
  10 | };
  11 | 
  12 | const IntlReducer = (state = initialState, action) => {
    at Parser.pp$5.raise (node_modules/babylon/lib/index.js:4454:13)
    at Parser.pp.unexpected (node_modules/babylon/lib/index.js:1761:8)
    at Parser.pp$3.parseIdentifier (node_modules/babylon/lib/index.js:4332:10)
    at Parser.pp$3.parsePropertyName (node_modules/babylon/lib/index.js:4156:96)
    at Parser.parsePropertyName (node_modules/babylon/lib/index.js:6229:23)
    at Parser.pp$3.parseObj (node_modules/babylon/lib/index.js:4045:12)
    at Parser.pp$3.parseExprAtom (node_modules/babylon/lib/index.js:3719:19)
    at Parser.parseExprAtom (node_modules/babylon/lib/index.js:7238:22)
    at Parser.pp$3.parseExprSubscripts (node_modules/babylon/lib/index.js:3494:19)
    at Parser.pp$3.parseMaybeUnary (node_modules/babylon/lib/index.js:3474:19)
    at Parser.pp$3.parseExprOps (node_modules/babylon/lib/index.js:3404:19)
    at Parser.pp$3.parseMaybeConditional (node_modules/babylon/lib/index.js:3381:19)
    at Parser.pp$3.parseMaybeAssign (node_modules/babylon/lib/index.js:3344:19)
    at Parser.parseMaybeAssign (node_modules/babylon/lib/index.js:6474:20)
    at Parser.pp$1.parseVar (node_modules/babylon/lib/index.js:2340:24)
    at Parser.pp$1.parseVarStatement (node_modules/babylon/lib/index.js:2169:8)

【问题讨论】:

  • 对象传播尚未在规范中,它处于 AFAIK 的第 3 阶段。
  • @elclanrs 我明白了。是否有一个值得信赖的良好来源,可以了解哪些提议的功能目前处于哪个状态?我修复错误的正确“面向未来”的方法是什么?添加“stage-3”预设或添加“transform-object-rest-spread”插件或其他?
  • 你可以在这个 repo github.com/tc39/proposals 中跟踪它。在您的情况下,您需要添加额外的 babel 转换。
  • @Drop 使用 babel site 看看你从预设中得到了什么。
  • 我检查了这两个资源,谢谢你们。通过将"transform-object-rest-spread" 添加到.babelrc 中的plugins 并安装babel-plugin-transform-object-rest-spread 包来解决此问题。 @elclanrs 随意发布它作为答案。

标签: javascript ecmascript-6 babeljs


【解决方案1】:

对象传播尚未在规范中,目前处于第 3 阶段,这意味着 env 预设不会提供此功能。

如果你想在 Babel 中使用这个特性,你需要添加 babel-plugin-transform-object-rest-spread 转换。

您可以在这个 repo https://github.com/tc39/proposals查看 ES 提案的状态

【讨论】:

  • 谢谢。刚刚将 Node 更新到 8.12.0,现在可以正常工作了! @elclanrs
猜你喜欢
  • 2019-11-15
  • 2015-09-14
  • 2018-08-24
  • 2018-12-16
  • 2019-08-20
  • 2020-12-20
  • 1970-01-01
  • 2018-05-19
相关资源
最近更新 更多