如何解决ESLint无法解析扩展运算符（Spread Operator）的语法错误？

Looks like you're hitting a common snag with ESLint not recognizing the object spread operator ({ ...render }). Let's break down why this is happening and how to fix it:

Why the Error Occurs #

The object spread/rest syntax ({ ...obj }) is actually an ES2018 feature, not ES2017. While ES2017 introduced rest/spread for arrays and function parameters, object spread wasn't standardized until ES2018.

Your current config sets ecmaVersion: 2017 and uses experimentalObjectRestSpread: true—but in newer ESLint versions (v5+), the experimentalObjectRestSpread option has been deprecated because the feature is now part of the official spec. This mismatch is causing the parser to choke on the spread operator.

Step-by-Step Fix #

Update your ESLint YAML config to target ES2018 and remove the deprecated experimental option:

env:
  browser: true
  es6: true
extends: 'eslint:recommended'
parserOptions:
  ecmaVersion: 2018  # Updated to support object spread natively
  sourceType: module
rules:
  indent:
    - error
    - 4
  linebreak-style:
    - error
    - unix
  quotes:
    - error
    - single
  semi:
    - error
    - always
  no-console:
    - off
  prefer-spread: "error"

If You're Stuck on an Older ESLint Version #

If you can't upgrade ESLint (e.g., working with a legacy project on v4 or earlier), keep experimentalObjectRestSpread: true but ensure your ecmaVersion is set to at least 6. Note that this is a temporary workaround—upgrading to the latest ESLint is always better for compatibility with modern JS features.

After updating the config, re-run ESLint and the parsing error should disappear.

内容的提问来源于stack exchange，提问作者Joey Yi Zhao