Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial


Chris Olin
Chris Olin
14,435 Points

Uncaught SyntaxError in Babel when trying to run React app locally

Downloaded the workspaces code so I could try loading/working on this as a project in WebStorm. Ended up getting a bunch of errors trying to bring the code in as-is. Created a new React app and when I go to start it with npm start, this happens when I try loading the page:

Uncaught SyntaxError: http://localhost:3000/src/app.js: Unexpected token (1:1)
> 1 | <!DOCTYPE html>
    |  ^
  2 | <html>
  3 |   <head>
  4 |     <meta charset="utf-8">
    at t.J.raise (babel.min.js:7)
    at t.X.unexpected (babel.min.js:5)
    at t.ge.jsxParseIdentifier (babel.min.js:8)
    at t.ge.jsxParseNamespacedName (babel.min.js:8)
    at t.ge.jsxParseElementName (babel.min.js:8)
    at t.ge.jsxParseOpeningElementAt (babel.min.js:8)
    at t.ge.jsxParseElementAt (babel.min.js:8)
    at t.ge.jsxParseElement (babel.min.js:8)
    at t.parseExprAtom (babel.min.js:8)
    at te.parseExprSubscripts (babel.min.js:6)
    at te.parseMaybeUnary (babel.min.js:6)
    at te.parseExprOps (babel.min.js:6)
    at te.parseMaybeConditional (babel.min.js:6)
    at te.parseMaybeAssign (babel.min.js:6)
    at t.parseMaybeAssign (babel.min.js:8)
    at te.parseExpression (babel.min.js:6)
    at t.z.parseStatement (babel.min.js:5)
    at t.parseStatement (babel.min.js:8)
    at t.z.parseBlockBody (babel.min.js:6)
    at t.z.parseTopLevel (babel.min.js:5)
    at t.parse (babel.min.js:5)
    at h (babel.min.js:4)
    at n.parse (babel.min.js:2)
    at n.parseCode (babel.min.js:2)
    at babel.min.js:14
    at n.wrap (babel.min.js:2)
    at e.transform (babel.min.js:14)
    at s (babel.min.js:1)
    at r (babel.min.js:24)
    at i (babel.min.js:24)
    at r (babel.min.js:24)
    at e.src.n.<computed>.l.content (babel.min.js:24)
    at XMLHttpRequest.n.onreadystatechange (babel.min.js:24)

I've googled the hell out of this and nothing makes sense. The <script type="text/babel"> is set, so why this is being thrown is beyond me.

3 Answers

Adi Chayot
Adi Chayot
3,618 Points

I have the same error.. Did you find out how to fix that?

Hey guys, just curious, did anyone ever solve this? I am having the same problem!

Hey guys, just curious, did anyone ever solve this? I am having the same problem!

I think it was me... I started using Create React App too soon. I think that for this course, that would have been the best place to start.