排列属性的语法错误

Syntax error from spread attribute

本文关键字：错误 语法 属性 排列      更新时间：2023-09-26

我正在使用yeoman生成器react webpack。我正在尝试在Main.js组件中使用排列属性：

require('normalize.css');
require('styles/App.css');
import React from 'react';
var FixedDataTable = require('fixed-data-table');
const TextCell = ({rowIndex, data, col, ...props}) => (
  <Cell {...props}>
    {data.getObjectAt(rowIndex)[col]}
  </Cell>
);
let yeomanImage = require('../images/yeoman.png');
class AppComponent extends React.Component {
  render() {
    return (
      <div className="index">
        <img src={yeomanImage} alt="Yeoman Generator" />
        <div className="notice">Please edit <code>src/components/Main.js</code> to get started!</div>
      </div>
    );
  }
}
AppComponent.defaultProps = {
};
export default AppComponent;

我一直收到这个错误：

中的错误/src/components/Main.js模块构建失败：SyntaxError:C:/dev/areactwebpack/src/components/Main.js：意外的令牌（8:41）

let yeomanImage = require('../images/yeoman.png');
const ImageCell = ({rowIndex, data, col, ...props}) => (
<ExampleImage src={data.getObjectAt(rowIndex)[col]}/>);
at Parser.pp.raise (C:'dev'react'react-webpack'node_modules'babylon'index.js:1378:13)

我在webpack或babel配置中缺少什么？（配置文件与生成器的相同）。

这是ES7的一个特性。您需要为babel预设transform-object-rest-spread。

你正在使用的生成器本身就是在使用这个生成器。它附带了一个.babelrc，这是你需要启用额外插件的地方：

"plugins": ["...other plugin", "transform-object-rest-spread"]

它还需要npm安装，并可能通过执行npm install --save babel-plugin-transform-object-rest-spread添加到package.json文件中。

该插件也包含在babel的stage2预设中（babel-preset-stage-2是完整的npm包名称）。

相关文章：