.jsx Unexpected token

[sandrodz]

I'm probably doing something wrong. getting unexpected token error:

  4 |   render: function() {
  5 | 
> 6 |     return ();
    |             ^
  7 |   }
  8 | });
  9 | 

deps:

  "dependencies": {
    "babel-core": "^6.5.2",
    "metalsmith": "^2.1.0",
    "metalsmith-react-templates": "^3.1.3",
    "react": "^0.14.7",
    "react-dom": "^0.14.7"
  }

build.js

var Metalsmith    = require('metalsmith');
var reactTemplate = require('metalsmith-react-templates');

Metalsmith(__dirname)
  .source('src')
  .destination('build')
  .clean(true)
  .use(reactTemplate({
    directory: 'templates',
    isStatic: true
  }))
  .build(function(err) {
    if (err) throw err;
  });

entry.jsx

var React = require('react');

var Entry = React.createClass({
  render: function() {

    return ();
  }
});

module.exports = Entry;

[yeojz]

The return value of render function should have at least one element.

So either

var Entry = React.createClass({
  render: function() {
    return (<div />);
  }
});

or

var Entry = React.createClass({
  render: function() {
    return null;
  }
});

[sandrodz]

Hi, thanks for looking into this :) I've tried with html elements, error remains the same.

  4 |   render: function() {
  5 | 
> 6 |     return (<p>Entry</p>);
    |             ^
  7 |   }
  8 | });
  9 | 

It seems there is some kind of issue with babel? I'm not familiar to say for sure. But I saw this: http://stackoverflow.com/questions/33460420/babel-loader-jsx-syntaxerror-unexpected-token

[sandrodz]

at the moment I've switched to this: https://github.com/richardstevens/metalsmith-react-tpl it uses babel < 6 and works perfectly fine.

I'd rather use your version though, @richardstevens seems to have cloned your repo without license or attribution. not cool.

[yeojz]

@sandrodz Ah. yes. I've managed to reproduce the error. Babel 6 changed the way they actually process files. Out of the box, it doesn't do anything now and needs plugins to actually transform the files. You'll need to have

npm install babel-preset-es2015
npm install babel-preset-react

and add a .babelrc file with the following set

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

For more information: https://babeljs.io/docs/plugins/#presets

Thanks. I'm aware of the re-upload and am keeping a lookout on it. There isn't much I can do about it at the moment though.. Sigh...

[sandrodz]

nice! it worked :) :+1:

Thanks!