8

I'm working with a vue.js project someone else started and I'm putting it on a production server. The npm run build compiles with no errors. But when i try to run the project in the browser i get a 

Uncaught SyntaxError: unexpected token <

Here's the index.html

<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><title>tst-apps-suite</title><base href=/ ><link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700,800" rel=stylesheet><link href="https://fonts.googleapis.com/css?family=Dosis:200,400,600,700,800" rel=stylesheet><link href=https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css rel=stylesheet><link href=/static/css/app.d79e04c40fa9145fe427147ef17b4576.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=/static/js/manifest.2ae2e69a05c33dfc65f8.js></script><script type=text/javascript src=/static/js/vendor.bfe581b46b720086662f.js></script><script type=text/javascript src=/static/js/app.19024fb1db555dd8417b.js></script></body></html>

I get that for all 3 .js asset files.

Server console output on the request. Looks like the files are getting returned:

GET /static/css/app.d79e04c40fa9145fe427147ef17b4576.css 200 1.580 ms - 820
GET /static/js/manifest.2ae2e69a05c33dfc65f8.js 200 3.095 ms - 820
GET /static/js/app.19024fb1db555dd8417b.js 200 3.157 ms - 820
GET /static/js/vendor.bfe581b46b720086662f.js 200 3.429 ms - 820

Any idea how to fix this?

Improve this question
2
  • It doesn't show you the line where the syntax error is? Commented Feb 21, 2018 at 21:52
  • no. i wish it did. when i click the file in console it takes me to the beginning of the index.html Commented Feb 21, 2018 at 21:55

2 Answers 2

Reset to default
7

Open the URLs of the scripts each on a different tab (or check the network tab of the developer tools), those URLs are probably returning a 404 (or some other error code) and a HTML error page.

So your code tries to parse those HTML error pages as JavaScript code, thus yielding that error.

It gets Uncaught SyntaxError: Unexpected token < because it tries to parse the HTML content (e.g. <html> ...) as JavaScript code.

Run the snippet below and see the error at the console.

<script type=text/javascript src=https://stackoverflow.com></script>
Check the console: "Uncaught SyntaxError: Unexpected token <"

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

i updated my question to show the files are getting 200 from server. Also getting same error when i try to open individual JS files in another window.
That 200 ok from the nodejs console was a false positive. It wasn't really returning the static assets. I fixed the public assets target and it started working.
@jtlindsey Hi there, I'm having the same issue, could you be more precise on how you fixed it ?
Great, this solution worked for me. I forgot to use extension .js with <script type="application/javascript" src="{{ asset('app-assets/js/core/app-menu.js') }}"></script> Opening URL manually from View Page Source solved my problem.
0

In my case it was due to the public path in my vue config which was looking for a static path like "/mywidget/" and was looking for assets in "/mywidget/dist/1234.js", which was a problem because in my deployment context there was no "mywidget" folder for the built html to find a js file in.

In my case I set the public path to "/" again and it worked.

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.