Search code examples
babeljsreactjsjsxmetalsmith

metalsmith static site generator (with react jsx)

I really want to create static site generator using reacts jsx templates/components. Jekyll and middleman had to be hacked to allow this...

But I've discovered http://www.metalsmith.io with plugin: https://github.com/yeojz/metalsmith-react-templates

I've following so far:

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

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

and jsx file:

var React = require('react');

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

    return ();
  }
});

module.exports = Entry;

when I run node build.js it errors out:

entry.jsx: Unexpected token

enter image description here

metalsmith-react-templates example seems to be outdated hence the problems?

Tried suggestion @:

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

  • @salivan

    If you're still having issues even after doing return (<p>Entry</p>);, it is highly possible that it's actually an issue from the babel compiler.

    What version of babel are you using?

    If it's version 6 and above, check that you've at least installed the babel-preset-react and the babel-preset-es2015 plugins.