Неожиданное Токен в React

Question

Я получаю следующее сообщение об ошибке:

events.js:72 
     throw er; // Unhandled 'error' event 
      ^
SyntaxError: /vagrant/resources/assets/js/react/react_app.js: Unexpected token (366:10) 
    364 | var InvestorsTable = React.createClass({ 
    365 | 
> 366 |  mixins: [Polling, StateHandler, ComponentBase], 
     |   ^
    367 | 
    368 |  render: function() { 
    369 |   return(
    at Parser.pp.raise (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:24:13) 
    at Parser.pp.unexpected (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:82:8) 
    at Parser.pp.expect (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:76:33) 
    at Parser.pp.jsxParseExpressionContainer (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:301:8) 
    at Parser.pp.jsxParseElementAt (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:370:30) 
    at Parser.pp.jsxParseElementAt (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:362:30) 
    at Parser.pp.jsxParseElement (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:398:15) 
    at Parser.parseExprAtom (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/plugins/jsx/index.js:410:21) 
    at Parser.pp.parseExprSubscripts (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:236:19) 
    at Parser.pp.parseMaybeUnary (/vagrant/node_modules/gulp-babel/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:217:19) 

Эта ошибка вызывается следующим кодом:

var InvestorsTable = React.createClass({ 

    mixins: [Polling, StateHandler, ComponentBase], 

    render: function() { 
     return(
      <Table data={this.state.data} /> 
     ); 
    } 
}); 

Как это недопустимый синтаксис? Где мой «неожиданный токен»? У меня есть еще один класс:

var CapitalRaised = React.createClass({ 

    mixins: [Polling, StateHandler, ComponentBase], 

    ... 

}); 

Этого класс не выбрасывает ошибку, когда его скомпилирован и его скомпилирован ПЕРЕД выше класс. Как и я не вижу, в чем проблема ....

Answer 1

У вас есть незакрытый элемент элемента JSX выше в вашем файле над этим классом. Так как вы не указали свой полный код, вот пример.

var CapitalRaised = React.createClass({ 
    render(){ 
    return (<div>); 
    } 
}); 

var InvestorsTable = React.createClass({ 

    mixins: [Polling, StateHandler, ComponentBase], 

    render: function() { 
    return(
     <Table data={this.state.data} /> 
    ); 
    } 
}); 

Элемент <div> не закрыт. Это вызовет Unexpected token (9:8), потому что JSX имеет форму <div> ... { mixins: [Polling и в JSX содержимое внутри {} должно быть выражением JS, а mixins: не является допустимым началом для выражений.