Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Create-React-App build - "Uncaught SyntaxError: Unexpected token <"

I realize this question has been asked multiple times but nothing has worked for me...

I'm trying to create a static build of a create-react-app project but I'm getting the following errors:

Uncaught SyntaxError: Unexpected token <     1.ca81c833.chunk.js:1 Uncaught SyntaxError: Unexpected token <     main.7ced8661.chunk.js:1 

Due to these files being minified, I'm not sure where to begin in debugging them.

Per other SO responses, here are some things I've tried:

//Original index.html file, which gets included in the built file: <script type="text/babel" src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>  //package.json "babel-preset-es2015": "^6.24.1", "babel-preset-react": "^6.24.1",  //.babelrc file {   "presets": ["react", "es2015", "stage-1"] } 

Not sure if this is relevant, but I have this on my express server, which I believe is standard:

if (process.env.NODE_ENV === "production") {      app.use(express.static('client/built'));     app.get("*", (req, res) => {         res.sendFile(require('path')             .resolve(__dirname, 'client', 'build', 'index.html'));     }) } 

Assuming it's actually a JSX issue, the whole thing is very confusing - shouldn't create-react-app be handling JSX automatically?

UPDATE: I just posted this question but already have a relevant update. I'm able to serve the page statically through pm2 by running pm2 serve build so I think the issue may be with my server configuration.

like image 565
SuperCodeBrah Avatar asked Jan 24 '19 06:01

SuperCodeBrah


People also ask

Why NPX create react app not working?

We no longer support global installation of Create React App. The current solution is simple — run create-react-app and target the latest version. Different versions of npm may help as well, and you can upgrade using the following command. Please note that this may affect other projects on your system.

What is uncaught SyntaxError unexpected token?

The "Uncaught SyntaxError: Unexpected token" occurs for multiple reasons: Having a <script /> tag that points to an HTML file instead of a JS file. Getting an HTML response from a server where JSON is expected. Having a <script /> tag that points to an incorrect path.

How do you solve uncaught SyntaxError unexpected identifier?

To solve the "Uncaught SyntaxError: Unexpected identifier" error, make sure you don't have any misspelled keywords, e.g. Let or Function instead of let and function , and correct any typos related to a missing or an extra comma, colon, parenthesis, quote or bracket.


1 Answers

Thanks this helped me a lot. Just wanting to add to this with an example from a Create-React-App project that had the same solution: I received the same error after deploying to heroku.

Uncaught SyntaxError: Unexpected token < after serve -s build

For me the problem was in the packages.json file. The "homepage" parameter i gave was incorrect. Changing this to the correct heroku URL solved the issue.

"homepage": "https://myapp.herokuapp.com/" 

Hope this addition is helpful.

like image 158
Michael Morrison Avatar answered Oct 13 '22 16:10

Michael Morrison