Express: $ not found from Jade file

Question

I'm creating a web application using the Express framework and Jade.

In one of my Javascript files, it can not find $. But I used script tags in the Jade file to include jQuery. jQuery is also installed in my node_modules folder.

This is my Jade file:

extends layout

block content
    script(src='/javascripts/vendor/jquery.min.js')
    script(src='/javascripts/vendor/jquery.validate.min.js')
    script(src='/javascripts/validate.js')
    .....

This is my JavaScript file (validate.js):

$(document).ready( function() {

    $('#signupForm').validate({
    ....
    });

});

I get the following error from JSHint:

 public/javascripts/validate.js
  1 |$(document).ready( function() {
     ^ '$' is not defined.
  3 |    $('#signupForm').validate({
         ^ '$' is not defined.

Answer 1

You should define your global variables by configuration, or jshint will try to treat $ as a local variable.

And you don't have a $ local variable.

You can write a comment in the file

/*global $:false */

or create a .jshintrc to avoid this issue.

"globals": {
    "$": false,
    "jQuery": false
}