Uncaught SyntaxError: Unexpected token '<'

JavaScript
1

I am getting the same error no matter how much i try. Been stuck at this for almost a hour. Please help

2

JS is trying to parse the JSX and it can’t because JSX is not valid JS. We write it as JSX (because it is much easier to read than the JS equivalent) and then use a program called Babel to convert it to valid JS. This happens invisibly for us behind the scenes.

On Codepen, go to Settings -> JS -> JavaScript Preprocessor and select “Babel”. Now (without you having to do anything) the JSX will be converted to valid JS before it runs. You won’t be able to see it happening, it just happens.

3

After that, you have a few errors to clear up.

4

Some things to consider:

React.component

Is that the right name for that property?

ReactDOM.render(myReactElement, ...

What is that component name? And why isn’t it in brackets.

Also, you import your react libraries in the Codepen settings, but then do it again in the HTML pane. This isn’t breaking your code but is the wrong way. Just do them once. Codepen would prefer the former.

5

Thanks for the comments. I got it working now. Thank you so much.

1 Like
6

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.