ReactJs: Unexpected token Error

Question

I am running this tests using Mocha with following configuration in my npm package.json

 "scripts": {"test": "mocha './app/**/*.spec.js' --compilers js:babel-core/register"}

and this results in the following error

employeeGrid.row.spec.jsx: Unexpected token (8:12)

Notice that line 8:12 is the following: return (<tr>

import React from 'react'; import TestUtils from 'react-addons-test-utils'; import expect from 'expect-jsx'; //import GridRow from './employeeGrid.row.jsx' class GridRow extends React.Component { render() { return (<tr> <td>{this.props.employee.name}</td> <td>{this.props.employee.position}</td> <td>{this.props.employee.yearStarted}</td> </tr>) } } describe('Grid Row', () => { it('Row Actions Test', ()=> { let employee = { "name": "Person", "position": "Software Engineer", "yearStarted": 2010 }; // shallow render // renders only one level deep const renderer = TestUtils.createRenderer(); renderer.render(<GridRow employee={employee}/>); const output = renderer.getRenderOutput(); console.log(output); }); });

Any idea what I am doing wrong?

I assume you're using babel? what does your .babelrc file look like? — rossipedia
– rossipedia, Commented Feb 3, 2016 at 23:34
github.com/eugenekgn/reactjs-tests/blob/master/.babelrc it's right here, but all the other es6(2015) work — eugenekgn
– eugenekgn, Commented Feb 4, 2016 at 0:24

rossipedia · Accepted Answer · 2016-02-04 06:03:54Z

With babel 6.0, JSX is no longer processed by default, nor is it processed with the es2015 preset. You need to use the react preset specifically to get the appropriate JSX transforms:

$ npm install babel-preset-react

and in your .babelrc:

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

Collectives™ on Stack Overflow

ReactJs: Unexpected token Error

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related