CODEWITHSUNDEEP
jquerynode.js
Farhan stands with Palestine
Farhan stands with Palestine

Reputation: 14126

Getting `Uncaught ReferenceError: $ is not defined` for $ in jquery in Node app

I had some files(html, css, js) deployed on a Apache Tomcat server. The html file make use of the below known libraries.

   <script src="libs/external/jquery/dist/jquery.min.js"></script>
   
   <link rel="stylesheet" href="libs/external/bootstrap/dist/css/bootstrap.min.css">
   <link rel="stylesheet" href="libs/external/bootstrap-select/dist/css/bootstrap-select.min.css" />
  
   <script src="libs/external/popper.js/dist/umd/popper.min.js"></script>
   <script src="libs/external/bootstrap/dist/js/bootstrap.min.js"></script>
   <script src="libs/external/bootstrap-select/dist/js/bootstrap-select.min.js"></script>

Now I want the same application to be served through Node JS Server.

I am new to node.

I created a app.js file and did the below basic stuff

var http = require('http'),
    url = require('url'),
    fs = require('fs');


var createServerCallback = function (req, res) {

    let url_parts = url.parse(req.url);
    let filePath = url_parts.pathname;

    let extension = '';
    let contentType = 'text/html';

    if (filePath == '/') {
        filePath = '/index.html';
    }

    if (url_parts.pathname.lastIndexOf(".") !== -1) {
        extension = url_parts.pathname.substring(url_parts.pathname.lastIndexOf("."));
        switch (extension) {
            case '.js':
                contentType = 'text/javascript';
                break;
            case '.css':
                contentType = 'text/css';
                break;
        }
    }
    let path = "." + filePath;

    fs.readFile(path, function (err, data) {
        res.writeHead(200, { 'Content-Type': contentType });
        res.end(data);
    });
    
};

http.createServer(createServerCallback).listen(8010, 'localhost');
console.log('Server running.');

The structure is as below-

index.html is the main file which internally references the scripts revealed above, maintained under libs folder.

All was working good but now I am getting Uncaught ReferenceError: $ is not defined.

enter image description here

As the jquery code in index.js will be executed in the browser window, what does node has to do with it?

Upvotes: 0

Views: 444

Answers (1)

Quentin
Quentin

Reputation: 943605

As the jquery code in index.js will be executed in the browser window, what does node has to do with it?

Look at the command line you are executing in your IDE.

You are explicitly loading index.js with Node.js!

Probably you hit some "Debug this JS file" button or key combination in your IDE and it is set to process JS files in Node.js.

Load the HTML document in your browser instead (after starting your Node.js program by running app.js with Node.js instead of index.js.

Upvotes: 1

Related Questions