Question

155

TypeScript and libraries such as jQuery (with .d.ts files)

rated 0 times [ 159] [ 4] / answers: 1 / hits: 39827 / 10 Years ago, fri, october 24, 2014, 12:00:00

I've looked all over the internets but I have yet to find a comprehensive guide that tells me how to take a library such as jquery and use it in a TypeScript project. If there is a guide that exists I would love to know where otherwise these are the things I really need to know:

I understand that the .d.ts file is only for intellisense so what do I need to get jquery to actually work (compile to ts?)

Do I need a requires or a //reference when using VS2013 and if so what is that actually doing?

Anything to go from these .d.ts and jquery js files to using the library (or any library) in my ts project.

I've been able to figure pretty much everything else out but this one has been rather frustrating.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

amari

Add To Favorites

Follow

Total Points: 736

Total Questions: 111

Total Answers: 90

Location: Saint Pierre and Miquelon

Member since Fri, Jan 28, 2022

2 Years ago

amari questions

1 Do SubmitEvents made by a 'submit' event contain the form values?

Mon, May 23, 22, 00:00, 2 Years ago

1 ERR_UNHANDLED_REJECTION UnhandledPromiseRejection when awaited inside an array of promise Objects

Mon, Jun 21, 21, 00:00, 3 Years ago

1 Dropdown with Search Box using Bootstrap Selectpicker not working

Thu, Jun 3, 21, 00:00, 3 Years ago

1 Redux-Toolkit: How to reject a createAsyncThunk?

Sat, May 15, 21, 00:00, 3 Years ago

1 Webpack, optimization chunking gives Conflict: Multiple chunks emit assets to the same filename error

Wed, Mar 3, 21, 00:00, 3 Years ago

View All

answered 10 Years ago zainsagez · Accepted Answer

You don't need to compile jquery to typescript, you just need to use a definition file that tells Typescript how the JavaScript library works.

Get definitions here:
https://github.com/DefinitelyTyped/DefinitelyTyped

or from NuGet if using Visual Studio.

Then just write your typescript as normal, and declare your library if needed:

declare var library : libraryTypedName

for example jquery's d.ts file already does this for you (check the bottom):

declare module jquery {

    export = $;

}

declare var jQuery: JQueryStatic;

declare var $: JQueryStatic;

https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/jquery

Now in your .ts file when you type $ it should give you the typescript intellisense.

Now the only things you want to include in your bundleconfig / <script> are the .js files, both yours and jquery / other libraries. Typescript is COMPILE time only!