5

I'm getting a very strange issue. When I open index.html(see below) in the browser, The DOM elements are rendering correctly, but I'm getting this console error:

Uncaught SyntaxError: Unexpected token '<'

To make sure the error is not coming from any code in my JavaScript, I emptied my JavaScript file so it had no code in it. So this is not any "code-in-javascript" related issue
What is it?

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <h1>HAHAHA</h1>
  <script type="text/javascript" src="./src/index.js"></script>
</body>
</html>
Jake Giri
  • 391
  • 1
  • 2
  • 10
  • 1
    sounds like your javascript file is an html error page. look at the network requests and open up the js file and see what it is – epascarello Jul 19 '21 at 16:56
  • Maybe you need to check your `index.js` file, maybe you out HTML there. – ogranada Jul 19 '21 at 16:57
  • @ogranada my index.js is emptied. I emptied it to track down the error source. Its something else – Jake Giri Jul 19 '21 at 16:59
  • 1
    @JakeGiri if you comment out the , you won't get that error again, its js related... – Esc Official Jul 19 '21 at 17:01
  • 1
    can you write console.log("Hello") into the index.js file and tell me if it still happens? – Esc Official Jul 19 '21 at 17:02
  • @EscOfficial yeah if i comment out the error is gone. but my index.js file in empty. i wiped out js code completely. Its just an empty js file. – Jake Giri Jul 19 '21 at 17:03
  • @EscOfficial yeah i wrote `console.log("hello")` into index.js file. The console.log is not executing and still seeing the same error – Jake Giri Jul 19 '21 at 17:05
  • So the path `./src/index.js` is not linking to the JS file. So your server says.... redirect it to the index page – epascarello Jul 19 '21 at 17:07
  • @epascarello sorry i did my typo in reply of your comment and it changed the meaning. I m writting it again. i opened up js file in network request. Its "HAHAHA". That is in my index.html. My index.js is empty. How does this happen? – Jake Giri Jul 19 '21 at 17:08
  • @epascarello but index.js file is in the `src` directory. And src directory and index.html is on the same level. How can this happen? – Jake Giri Jul 19 '21 at 17:09
  • in case you are working with google chrome disabling cache might help: https://stackoverflow.com/questions/5690269/disabling-chrome-cache-for-website-development (other browsers may have the same feature) – caramba Jul 19 '21 at 17:12
  • 1
    Maybe you need to check your server cache policies, because looks like it's not configured as a dev server, that is why your error persists in that way. try restarting the dev server. – ogranada Jul 19 '21 at 17:13
  • @caramba i did that too. Same issue – Jake Giri Jul 19 '21 at 17:14
  • @ogranada yeah that was something with the live-server npm package. May be it was some confirguration thing which i need to tweak but that is beyond my knowledge. So when i used inbuilt live-server extension of vs-code, its working perfectly now. – Jake Giri Jul 19 '21 at 17:20
  • You can use the `http-server` package (https://www.npmjs.com/package/http-server) that allows you to define the cache time `http-server -c-1 . ` – ogranada Jul 19 '21 at 17:26
  • @ogranada I'll look into it though. But strangely I don't know what was wrong with my post that it got downvoted. Its discouraging for me to post again. – Jake Giri Jul 19 '21 at 17:29

2 Answers2

5

Change the script type to "text/babel" and the error will resolve.

<script type="text/babel" src="./src/index.js"></script>

rahulkarda
  • 61
  • 1
  • 3
4

Finally I figured out the error. I was using npm live-server package. When I used live-server provided by vs-code as an extension, the issue is gone. It's working perfectly fine now.

Jake Giri
  • 391
  • 1
  • 2
  • 10