当使用 webpack 编译 React 时，它返回 Unexpected token (

Posted 2023-03-13

【中文标题】当使用 webpack 编译 React 时，它返回 Unexpected token (

【英文标题】：When using webpack to compile React it returns Unexpected token (

【发布时间】：2015-10-16 08:56:32

【问题描述】：

确切的错误信息是

模块解析失败： /www/devreact/node_modules/jsx-loader/index.js!/www/devreact/app/dashboard.js 第 11 行：意外的令牌（您可能需要适当的加载程序来 处理这种文件类型。

Webpack 在以下代码上失败。 '

var Add = React.createClass(
  render () 
    var sum = this.props.x + this.props.y;
    return React.DOM.span(, sum);
  
);

这里是加载到我的 webpack.config.js 文件中的加载器。

  module:
    loaders:[ /*Loaders like helprs Good for transcompiling ES6 */
      test:/\.js$/,loader:'jsx-loader' /*Test whenever you hit a javascript file use jsx-loader When using require module */
      ,test:/\.json$/,loader:'json-loader'
    ]
  ,

【参考方案1】：

render 需要是一个函数：

var Add = React.createClass(
  render: function () 
    var sum = this.props.x + this.props.y;
    return React.DOM.span(, sum);
  
);

否则，在 creatClass 中定义对象字面量时会出现语法错误。