Uncaught Syntax Error: Unexpected token (First program)

Question

Uncaught SyntaxError: Unexpected token < Calling a javascript with console.log ("hello world");

I'm codding my first steps in the node, without any framework at the beginning to understand the main and simple aspects of node.js

I just created my server in Node.js (main.js) and calling an index.html, this index.html call a sayHi.js, it only has a console log. But this script not works...

I would like to do a controller/script to this HTML file to start programming...

//main.js
var http = require("http");
var fs = require("fs");
var url = require('url');

//create a server object:
http.createServer(function(req, res) {

    if (req.url === "/index" || req.url === '/') {
      fs.readFile('app/views/index.html', function(err, data) {
        res.writeHead(200, {
          'Content-Type': 'text/html'
        });
        console.log("Requested URL is index: " + req.url);
        res.write(data);
        res.end();
      });
    } else if (req.url === "/modbus") {
      fs.readFile('app/views/modbus.html', function(err, data) {
        res.writeHead(200, {
          'Content-Type': 'text/html'
        });
        console.log("Requested URL is index: " + req.url);
        res.write(data);
        res.end();
      });

    } else {
      fs.readFile('app/views/404.html', function(err, data) {
        res.writeHead(200, {
          'Content-Type': 'text/html'
        });
        console.log("Requested URL is index: " + req.url);
        res.write(data);
        res.end();
      });
    }
  })
  .listen(8080); //the server object listens on port 8080
console.log('Server running at http://127.0.0.1:8080');

<!DOCTYPE html>
<html>
  <head>
    <title>Index</title>
    <script src="../scripts/sayHi.js"></script>
    <!-- <link rel="stylesheet" href="/app/styles/myStyle.css" /> -->
  </head>

  <body>
    <h1>Hello! Now you know how to serve HTML files using Node.js!!!</h1>

    <p id="demo"></p>
    <a href="\modbus">Modbus</a>
  </body>

</script>
</html>

//sayHi.js
console.log("hello world");

Uncaught SyntaxError: Unexpected token <

<a href="\modbus">Modbus</a> will be <a href="/modbus">Modbus</a> — ellipsis
You have an errant </script> tag in the bottom of your HTML file, though not sure how relevant that is. — Tyler Roper
When your browser encounters the script tag it asks your server for the js file, and your server is responding instead with an html page (probably your 404 page) because you didn't program a server route for js files. — Jared Smith

Reza Reza · Accepted Answer · 2019-01-30T18:38:43

The first thing I would point out is that your HTML file is looking for a javascript file under the name of sayHi.js, from ../scripts/sayHi.js path.

Your Html file is served at http://localhost:8080/ and tries to get http://localhost:8080/scripts/sayHi.js to which you have no route, so the server.js will try to send the error html, which is in 404.html file.

this is an HTML file, but is injected as a javascript file, which will result in the console error in the browser.

My suggestion is to return appropriate status code, i.e. 404, in the header, and build a route to the sayHi.js in your server file.

Uncaught Syntax Error: Unexpected token (First program)

4 Answers