Philip7899 Philip7899 - 2 months ago 10
React JSX Question

React not working. Error says (index):13 Uncaught SyntaxError: Unexpected token <

I am new to React and just trying to build a simple component to display to the page. For some reason I am getting the error:

(index):13 Uncaught SyntaxError: Unexpected token <


Here is my code:

<html>
<head>
<title></title>
</head>
<body>
<div id="yolo"></div>
<script src="react.js"></script>
<script src="react-dom.js"></script>
<script>
var Yolo = React.createClass({

render: function(){
return <h1>Waddup doc?</h1>;
}
});

ReactDOM.render(
<Yolo />,
document.getElementById('yolo')
);
</script>
</body>
</html>

Answer

You can't use JSX if you aren't using something that transpiles it. If you use create-react-app it will handle this problem for you. https://github.com/facebookincubator/create-react-app If you want your example to work, you would have to replace the JSX with React.createElement, or use an in browser JSX transformer.

Edit: If you want to play around with a script tag, remove react and react-dom and use this <script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

Comments