How to use triple-slash references for libraries in Visual Studio Code?

Question

I'm trying to get Visual Studio Code 0.3.0 to recognize my JavaScript libraries. However, intellisense is complaining. Here's a repro:

1. Open Visual Studio Code
2. File > Open Folder (select a freshly created empty folder)
3. Add a file mytest.js to that folder
4. Download jquery-2.1.4.js (full/uncompressed) to that folder (appears in the side bar)

5. Enter this in mytest.js:

   var x = jQuery('body');
   

Result: squiggly green lines under jQuery. Note that jQuery is just an example, I've had the same issue with libraries such as KnockoutJS and QUnit, etc.

I've tried adding a triple-slash reference like so:

/// <reference path="jquery-2.1.4.js" />

Heck, it even autocompleted the path for me. I've tried varying the path a bit, e.g. a ./ at the start, but the result is thus far invariably:

Hovering jQuery gives a popup saying:

Cannot find name 'jQuery'.
any

Still squiggly green lines. I hate squiggly lines though. How can I get rid of them?

Answer 1

You Need To Refefence the jQuery TypeScript Definition File.

---

You need a 'typings' folder in the root of your app or site. Within the 'typings' folder you need a jquery.d.ts file.

Your reference to the file should be similar to the following depending upon where the file reference is located in relation to the typings/jquery.d.ts file and folder:

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

Here's a TypeScript Definitions File reference for Node.js:

/// <reference path="typings/node/node.d.ts"/>

The easiest way to accomplish this is to click on the green squiggly in VSCode then click the light bulb and select Add /// reference to 'XYZ.d.ts'. This will automatically add everything you need.

In a comment above the Definitely Typed web site was referenced if you want or need to do this manually.