CODEWITHSUNDEEP
angularjstypescript
ragona
ragona

Reputation: 93

How can I include a non TypeScript package in my TS application without upsetting the compiler?

What is the best solution for including vanilla JS libraries in TypeScript projects? This is one of those things that "works" just fine, but I feel like I'm clearly not going about this in a "best-practices" sort of way.

Let's say, for example, that you want to use EaselJS in an Angular project. You can just add a link to CreateJS in your index.html file as usual, and then you have access to the global createjs object, but your compiler will of course know nothing about createjs, and will assume that you've got an error. What's the best way to let TypeScript know about this external source?

Moreso, what's the best way to enable auto-completion so that when I type "createjs." I get a list of the methods in that file? Is mixing JS and TS like this possible?

I suppose I could create a TypeScript shim that passes things through to the createjs object, but then that shim would be riddled with "errors."

Thoughts?

Thanks!

Upvotes: 2

Views: 97

Answers (2)

ragona
ragona

Reputation: 93

Oh, looks like this is done via a definition (.d.ts) file. There's a good tutorial here. In fact, CreateJS already has one of these available here, and if you go up a level in that Github Repo you'll find tons of these definition files in the DefinitelyTyped repository. I haven't tried this out yet, but it looks like the right direction.

Upvotes: 3

Hamlet Hakobyan
Hamlet Hakobyan

Reputation: 33391

You should use ambient declaration.

declare var createjs;

You use ambient declarations to tell the TypeScript compiler that some other component will supply a variable.

Upvotes: 2

Related Questions