Syntax Error "Expecting expression, got '<'" while trying to run reactjs tutorial

There are two issues with the code you've posted.

The first is that the JSX transformer is not transforming your code because the appropriate type attribute is not present on the script tag.

Change

<script>
var Hello = React.createClass({
...

to

<script type="text/jsx">
var Hello = React.createClass({
...

Secondly, you're calling document.getElementById('container') before that div actually exists on the page; move that final script tag and its contents to after the div (e.g., to the bottom of the body).

You should end up with code that is similar to how it's shown in the tutorial:

<!-- index.html -->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Hello React</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/JSXTransformer.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  </head>
  <body>
    <div id="content"></div>
    <script type="text/jsx">
      // Your code here
    </script>
  </body>
</html>

Tags:

Reactjs

Recent Posts