typescript error: TS2304: Cannot find name '$'

javascript node.js typescript

20,114

Solution 1

Turns out I was missing the "@types/jquery" node module, which contains a definition of "$". Once I added "@types/jquery": "^3.2.5" to the list of "devDependencies" in my package.json and reinstalled via "npm install", everything worked fine.

Solution 2

Did you try to :

 import $ = require('jquery');

at the 1 line? This should work. Though you should have a deeper look into es6 modules and ts modules to get a grip on how you could take advantage of the es6 modular system. Also d.ts files...

This should be helpful: https://www.typescriptlang.org/docs/handbook/modules.html

Solution 3

If AngularCLI is where your injecting JQuery, then in your controller/component, you can declare the variable like so:

declare var $: any;

Solution 4

One reason for this kind of error is your node_modules doesn't contain the type definitions for jquery ie. the package @types/jquery is missing.

My workaround is as follows:

Open the command prompt in the root of your project folder and type:

npm install --save @types/jquery.

If you are posed with a question to choose the version, choose the latest one.
Once the above command ends successfully, run yarn install.
Once the above install is success, run yarn start to start your project.

View more solutions

20,114

Author by

Oblomov

Updated on July 12, 2022

Comments

Oblomov 11 months

The statement

 x = $('#msgBox_' + scope.boxId).position().left;

generates an

error TS2304: Cannot find name '$'

although jquery and @types are installed in the node_modules folder.

My tsconfig.json looks like that:

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "sourceMap": true,
    "moduleResolution": "node",
    "declaration": true
  },
  "exclude": [
    "node_modules"
  ]
}

How can I fix that?

Oblomov almost 6 years

at the 1st line of which file?
George Pasquali almost 6 years

The ones where you use jquery.
OctoD almost 6 years

Due to current tsconfig.json, this should not be required. Jquery is defined also as a global var, you have to import it only if the "isolatedModules" flag is true.
Oblomov almost 6 years

Actually, it fixes the bug. However: In a previous version of the same code, this import was not necessary. I currentyl don't really understand, why I need it now.
Oblomov almost 6 years

@OctoD How and where would I best define jquery as a global var in a typescript project?
George Pasquali almost 6 years

It is not defined as a global variable... It is only installed as a node_module. Also you should install @types/jquery if you havent.
George Pasquali almost 6 years

you could make it global like this window.$ = $; But this is bad practice i guess...
OctoD almost 6 years

@user1934212 it's defined both as global or module inside the types definition github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types‌/… you should do nothing.
Oblomov almost 6 years

@OctoD: Interesting point. I just looked into my node_"modules/@types" folder and there is no "jquery" subfolder. How can I fix that?
OctoD almost 6 years

Try to run npm i --save-dev @types/jquery.
StackOverflowUser almost 5 years

I had moved some code from an Angular 2+ solution to an Angular 6 solution and this solved the problem for me.