How to import JQuery into a Typescript file?
ajax, import, javascript, jquery, typescript
Solution
An import is not required. Instead, add a reference to the Typescript definition file the top of the file. So the first line of the `WebAPI.js` should be
/// <reference path ="../typings/jquery/jquery.d.ts"/>
instead of
import { $ } from '../jquery-3.1.1';
According to the DefinitelyTyped wiki:
A TypeScript declaration file is way of defining the types, functions and parameters in an external third-party JavaScript library. By using a declaration file in your TypeScript code will enable Intellisense and type checking against the external library you are using.
`jquery.d.ts` is a part of the DefinitelyTyped Library found on GitHub. Definitely Typed can be include in Visual Studio projects via the NuGet Package Manager.
Problem
Update No import was required. Instead, I needed to add a reference to the top of the file. So the first line of my WebAPI.js should have been `/// <reference path ="../typings/jquery/jquery.d.ts"/>` instead of `import { $ } from '../jquery-3.1.1';` I am trying to import jQuery to use in a Typescript file, but I am receiving a variety of errors with everything I try. I followed the solutions here and here, but without any luck. tsconfig.json ``` { "compilerOptions": { "removeComments": true, "preserveConstEnums": true, "out": "Scripts/CCSEQ.Library.js", "module": "amd", "sourceMap": true, "target": "es5", "allowJs": true } ``` WebAPI.js ``` import { $ } from '../jquery-3.1.1'; export class ExpenseTransaction extends APIBase { constructor() { super(); } Get(): void { let expenses: Array<Model.ExpenseTransaction>; let self = this; $.ajax({ url: this.Connection, type: "GET", contentType: "application/json", dataType: "json", success: function (data: any): void { expenses = self.ConvertToEntity(data.value); }, error: function (data: any): void { console.log(data.status); } }); }; } ``` I have also tried `import * as $ from '../jquery.3.1.1'` Errors - `Module jquery-3.1.1 has no exported member $` - `Property ajax does not exist on type (selector: any, context: any) => any`