Cannot find type definition file for 'jquery'

Question

I just ran an update in NuGet to update my my packages. Afterwards, I can no longer compile and I receive the above error.

The jquery definition file is in my project. But for some reason, the bootstrap definition file can no longer find it.

It's been a while since I worked on this project. I'm pretty sure I had my definition files in a completely different directory before the update. But most of the code and file structure has been created automatically by Visual Studio NuGet packages.

Where are these links or references located so that the definition files can be found properly? I'm very new to TypeScript, so if you can explain in detail or provide links for further reading, it would be appreciated

Edit:

I've discovered that these are called Triple-Slash Directives. But that pages doesn't tell me enough to understand this error.

It tells me that <reference types="..."/> should be used for @types packages which is what I believe .d.ts files are. I tried changing the name of jquery.d.ts to index.d.ts. And I've tried including the whole path such as ../jquery/jquery.d.ts. Neither of these worked.

Finally, I found the following line in angular.d.ts:

/// <reference path="../jquery/jquery.d.ts" />

I copied that into the bootstrap index.d.ts and that seemed to fix the error.

But this doesn't make sense to me. First, I'm trying to link to a definition file, not a TypeScript file. So I should be using reference types, not reference path, according to the above article. But reference types does not work. What am I missing here?

The article also says:

Use these directives only when you’re authoring a d.ts file by hand.

I didn't write these files. They came from NuGet and look to be automatically generated. So why do I need to change this?

I have the same problem after starting new project with .net mvc and typescript. For now I reverted back bootstrap DTS to version 0.9.0. In this version bootstrap types defnition looks like jquery types definition (http://joxi.ru/MAjMJbEU4o36K2) — Dmitry Bykadorov, Feb 21 '17 at 11:20
I was experimenting with a tsconfig.json file and setting the typeRoot but no luck. https://www.typescriptlang.org/docs/handbook/tsconfig-json.html — David De Sloovere, Mar 09 '17 at 16:53

score 20 · Answer 1 · answered Mar 21 '17 at 00:32

20

They came from NuGet and look to be automatically generated.

Don't use nuget for type definitions. NPM is the way to go.

npm install @types/jquery -D

And then you can:

<reference types="jquery"/>

welcome to the future

answered Mar 21 '17 at 00:32

basarat

261,912
58
460
511

27

"Don't use nuget for type definitions. NPM is the way to go." - I miss the days when TypeScript in Visual Studio "just worked" and I didn't need to separately (and manually) download and install node, npm and `typings`. I wouldn't mind so much if VS and the TypeScript toolchain would tell me what to do - the learning-curve has steepened considerably since TypeScript 2.0 was released and the experience is becoming far more beginner-hostile. – Dai Jul 15 '17 at 10:50
9

downvoted because, while the suggestion may work, it doesn't actually answer the question of "So why do I need to change this?" – joelmdev Jan 09 '18 at 18:51

score 2 · Answer 2 · answered Dec 13 '18 at 07:45

2

I found that changing /// <reference types="jquery" /> to /// <reference path="../JQuery.d.ts" /> in jquery.slim.d.ts after installing @types/jquery fixed this issue for me.

answered Dec 13 '18 at 07:45

Z Wu

21
1

score 0 · Answer 3 · answered Apr 08 '20 at 13:41

One option will be setting the property typeRoots on your tsconfig.json (you will need to create one if your project still don't have it) to the actual path of the folder that contains the definition files, that if you are using Nuget and DefinitelyTyped it should be the typings folder inside the Scripts folder. Therefore:

{
  "compilerOptions": {
    "typeRoots": [
      "./Scripts/typings"
    ]
  }
}

What basarat posted is the correct 2020 way to proceed, but maybe you are working on a legacy project where migrating to NPM is not an option right now.

score 0 · Answer 4 · answered May 14 '21 at 13:20

Wanted to give an updated answer when getting this error as part of an Angular project. Was getting the error when running unit tests, and my problem was that in my tsconfig.json I had jQuery type listed as:

{
  "compilerOptions": {
    ...,
    "types": [
      "node, jQuery"
    ]
  }
}

The fix for me was to use all lower case:

{
  "compilerOptions": {
    ...,
    "types": [
      "node, jquery"
    ]
  }
}

score 0 · Answer 5 · answered Oct 18 '21 at 12:38

0

If the Web project is using libman, right click on libman.json and click on "Restore Client-Side Libraries".

answered Oct 18 '21 at 12:38

CPHPython

12,379
5
59
71

Cannot find type definition file for 'jquery'

5 Answers5