react-router 示例 huge-apps：webpack 无法识别的语法

Question

错误信息如下：

ERROR in ./huge-apps/components/GlobalNav.js
Module build failed: SyntaxError: /home/yyangbian/workspace/react-router-examples/huge-apps/components/GlobalNav.js: Unexpected token (22:2)
  20 | 
  21 | styles.activeLink = {
> 22 |   ...styles.link,
     |   ^
  23 |   background: light,
  24 |   color: dark
  25 | }

下面是本地安装的依赖：

  "devDependencies": {
    "babel": "^6.5.2",
    "babel-core": "^6.5.2",
    "babel-loader": "^6.2.3",
    "babel-preset-es2015": "^6.5.0",
    "babel-preset-react": "^6.5.0",
    "css-loader": "^0.23.1",
    "style-loader": "^0.13.0",
    "webpack": "^1.12.13",
    "webpack-dev-server": "^1.14.1"
  },
  "dependencies": {
    "react": "^0.14.7",
    "react-addons-css-transition-group": "^0.14.7",
    "react-dom": "^0.14.7",
    "react-router": "^2.0.0"
  }

webpack 配置文件与 git 存储库中的配置文件相同：webpack.config.js 下面是我的 .babelrc 文件：

{
  "presets": ["react", "es2015"]
}

Answer 1

ES2015 Babel 预设中不包含对象剩余扩展语法（即您在样式对象中使用的 ...），因为它不是 ES2015 规范（或任何规范，迄今为止）。您需要安装 object rest spread transform plugin or the stage 2 preset。

react-router 示例 huge-apps：webpack 无法识别的语法

react-router examples huge-apps: syntax unrecognized by webpack

reactjs

webpack

react-router

babeljs