Node.js & JQuery: “ReferenceError: $ is not defined” error. How do I use jquery with node on the server?

Question

Help! I\'m trying to use jquery in my node.js app, but I keep getting an error when I try to use \'$\', saying \"$ is not defined\"... but I defined it at the top! Here\'s what

Answer 1

Your doSomething function is declared outside if the bounds of the jsdom.env function. $ is only accessible inside that callback. Something like this should work:

var $;

require("jsdom").env("", function(err, window) {
    if (err) {
        console.error(err);
        return;
    }
    $ = require("jquery")(window);
    doSomething();
});

 function doSomething(){
    var deferred = $.Deferred();
}

Though I think it would be more idiomatic to just declare doSomething inside the callback. That way it would have access to jquery from the outer scope.

require("jsdom").env("", function(err, window) {
    if (err) {
        console.error(err);
        return;
    }

    function doSomething(){
        var deferred = $.Deferred();
     }
    var $ = require("jquery")(window);
    doSomething();
});

Answer 2

If you don't need a full DOM available and just want to parse and scrape/manipulate html elements, there is cheerio which is more lightweight than jsdom and still gives you a jQuery-like API.

Answer 3

//make sure $ is available in the global scope
var $;

function doSomething(){
    var deferred = $.Deferred();
}

require("jsdom").env("", function(err, window) {
    if (err) {
        console.error(err);
        return;
    }
    // assign it
    $ = require("jquery")(window);

    // you have to call it in here because you are in a callback 
    doSomething();
});

Answer 4

All you need to do is to move the call doSomething() inside your callback function right after $ initialization.

// define global variable for further usage
var $;

require("jsdom").env("", function(err, window) {
    if (err) {
        console.error(err);
        return;
    }

    // initialize global variable
    $ = require("jquery")(window);

    // will work properly here
    doSomething();
});

function doSomething() {
    // using already initialized global variable
    var deferred = $.Deferred();
}

In your example there are 2 things you need to take care:

1. Asynchronous functions

We need to guarantee doSomething will be called only after $ initialization.

2. Variable scopes

It really makes sense what is the place you declared doSomething function and in your example doSomething doesn't know $ exists at all. So we need to define it somewhere (e.g. globally) to make a closure with $ variable.