typescript: declaring types in a separate JavaScript file

Question

typescript: declaring types in a separate JavaScript file

Imagine you have a JavaScript library that exports some types for use (let's call it js1.js). You also have some TypeScript code sitting in a <script type="module"> tag that you want to use these types with (let's say ts1.ts). To make this work, you might write:

import {sometype} from "./js1.js"

However, in order for the compiler to recognize these types, you need a description file (ts1.d.ts). What should be included in this description file to ensure everything functions correctly?

I've searched online and in the TypeScript documentation but haven't found any helpful resources.

typescript module declaration

Answer 1

Answer №1

It is essential for your blah.d.ts file to have the same name as your blah.js file.
Your blah.d.ts file should export the same items as your blah.js file, but with type annotations instead of actual values.

Another option would be to create a blah.ts file that contains the exact code as your blah.js file, but with added type declarations; this approach will yield the same results.

For example:

// blah.js
export function add(a, b) { return a + b; }
// blah.d.ts
export function add(a: number; b: number): number;

OR

// blah.js
export function add(a, b) { return a + b; }
// blah.ts
export function add(a: number, b: number): number { return a + b; }

Answer 2

It is essential for your blah.d.ts file to have the same name as your blah.js file.
Your blah.d.ts file should export the same items as your blah.js file, but with type annotations instead of actual values.

Another option would be to create a blah.ts file that contains the exact code as your blah.js file, but with added type declarations; this approach will yield the same results.

For example:

// blah.js
export function add(a, b) { return a + b; }
// blah.d.ts
export function add(a: number; b: number): number;

OR

// blah.js
export function add(a, b) { return a + b; }
// blah.ts
export function add(a: number, b: number): number { return a + b; }

typescript: declaring types in a separate JavaScript file

Answer №1

Similar questions

Issue with Angular 9 application: Unable to properly render form fields within a Material Design Dialog

Understanding the data types of functions in TypeScript can be quite important for

Step-by-step guide on setting up pnpm directly, without the need to first

How to utilize methods from different pages in Ionic 2

Derive a subset Union from a Union in Typescript

The combination of React, Typescript, and MaterialUI Paper results in a stunning design with a sleek and

Definition of Angular 2 File

Experiencing an array of issues while attempting to convert my HTTP request into an

Utilize CountUp.js to generate a dynamic timer for tracking days and hours

What is the process for including an item in an array within Firestore?

Is there a feature in VS Code that can automatically update import paths for JavaScript and TypeScript files when they are renamed or

Obtain the data from a promise in Angular

Oh no! A critical mistake has occurred: Mark-compact operations are not working efficiently near the heap limit, leading to a failed allocation due to the

Troubleshooting: Ngx-Echarts Animation Issue at Startup

Issues detected with the functionality of Angular HttpInterceptor in conjunction with forkJoin

The 'bind' property is not found within the 'void' data type

What method can be used to fetch generic type parameter in typescript?

Building state from multiple child components in Next.js/React: Best Practices

Developing a TypeScript library for versatile features across multiple projects

Troubleshooting compatibility issues between Sailsjs Services and TypeScript in Vscode