12

I have a simple TypeScript (ts) which needs a function from a JavaScript file. How can I import that js file into ts file? Do I have to create a ts file for that js file to be able to use it in my ts file?

2 Answers 2

24

The easiest way is to just declare the function you're using:

File1.js

function greet() { return "Hello!"; }

File2.ts

declare function greet(): string;

/* ... later ... */
var hi = greet();

If your scenario is more complex (i.e. multiple files referencing File1.js, or there are many functions in File1.js that would clutter up File2.ts), you can make a File1.d.ts file and reference that from File2.ts:

File1.d.ts

function greet(): string;

File2.ts

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

/* ... later ... */
var hi = greet();
Sign up to request clarification or add additional context in comments.

4 Comments

Hi Ryan, thank you this works! One file I use however has methods added to Math library. So Math.uuid.js file has three methods in it; Math.uuid() returns string, and other two... TS complains to this "declare function Math.uuid(): string;" (obviously). How would I bring these methods in? Thanks!
Found it! I declared this interface... interface Math { uuid(): string; } and it's all good.
Is there a way to automatically generate a *.d.ts file from the .js file? Thanks - dave
@DavidThielen some good explanations of why that's not easy to do here typescript.codeplex.com/discussions/451987. i'm sure there's much more written on the subject but this satisfied my questions
2

Just for the archives,if you add a /// ref for a JavaScript file inside your TS file, the compiler will try to validate all the code in the JS files and throw a huge error list. Try it with jQuery or something like that and you'll see what I mean.

4 Comments

Yup, I have seen that. I put declare var $ and not include that ref in projects which don't have jquery the d.ts file.
That's the quickest way to add support for any type that you don't have a .d.ts file for. The nice thing about the definition files is you get Intellisense.
I use DefinitelyTyped files all the time, that's a great project.
it doesn't even let you do this (i'm not sure if this changed since 2012) - you get Incorrect reference: Only files with a .ts extension are allowed - or maybe you meant to rename the .js to .ts. either way you're certainly right that you get a big mess :-)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.