Typescript and jQuery compilation error: cannot find name '$'

Question

I am testing typescript using jquery, but when I compile the test.ts file, it always gives me an error message: Cannot find the name "$".

I already imported jquery and added a link to the definition. If I use import $ = require("jquery") in my test.ts file, another " Cannot find module jquery " error will occur when performing tsc compilation. However, the jQuery folder already exists in the node_modules folder.

Does anyone know what is the proper way to use jquery in typescript?

Following are my steps:

• Install jquery with npm install jquery --save
• Set identifiers and jquery definition with typings install --global --save dt~jquery
• Add the jquery link at the top of test.ts /// <reference path="../../../typings/globals/jquery/index.d.ts" />

tsconfig.json

 { "compilerOptions": { "jsx": "react", "outDir": "./dist", "sourceMap": true, "noImplicitAny": true, "module": "commonjs", "target": "es5", "experimentalDecorators": true }, "exclude": [ "node_modules" ], "files": [ "./typings/index.d.ts", "./src/wo/tests/test.ts", ] } 

test.ts

 /// <reference path="../../../typings/globals/jquery/index.d.ts" /> let test:any=$("div"); 

Answer 1

If you find these errors in 90% of cases due to a version problem Problem @ types / jquery

Try to run:

  npm install jquery --save 

Then in app.module.ts :

 import * as $ from 'jquery'; 

Then do:

  npm install @types/ jquery@2.0.47 

And you must be ready to go.

Answer 2

I do not know if this helps, but I solved the same problem for my dumper.

First I installed jQuery with this command: npm install --save-dev @types/jquery

Then add the dependencies to your angular-cli.json file:

 "styles": [ "../node_modules/bootstrap/dist/css/bootstrap.css", "../node_modules/font-awesome/css/font-awesome.css", "../node_modules/ng2-datetime/src/vendor/bootstrap-datepicker/bootstrap-datepicker3.min.css", "styles.css" ] "scripts": [ "../node_modules/jquery/dist/jquery.js", "../node_modules/ng2-datetime/src/vendor/bootstrap-datepicker/bootstrap-datepicker.min.js" ] 

I think adding a jQuery part might work for you. Please let me know if this works.

Answer 3

Install and import the following package. this will be resolved due to an error ("Cannot find name '$'"). Corner Version 7

import 'datatables.net';

Answer 4

You may have vulnerabilities that need to be fixed.

Run npm audit fix to fix them, or npm audit for more information.