aherve aherve - 29 days ago 7
Javascript Question

Typescript: how to import a class from a javascript file?

I would like to :


  • Import a js file that defines a class:
    ./myClass/index.js

  • Declare the public methods of
    MyClass
    somewhere (in index.ts or a specified declaration file, I really don't know how to do it)

  • Have a typescript file that exposes the class:
    index.ts



something like

// index.ts
import MyClass from './myClass' // or require, or anything that would work
export {MyClass}


and

// myClass/index.js
export default class MyClass {
...
}


This obviously does not work, as the import of
./myClass/index
won't find the module.

The thing is, I tried to create a
./myClass/index.d.ts
file based on this example, but no matter what, I still have a Error: Cannot find module './myClass/index.js' error at runtime :(

I feel like I miss some typescript basics here but I'm striving to find some clear resources.

Any ideas ?

Answer

There is no export default class in JavaScript. What you can do is write your JS file like this. myClass/index.js

"use strict";
class MyClass {
  hello(name) {
    console.log(`Hello ${name}`);
  }

}
exports.default = MyClass;

Create a Type definitions for it. myClass/index.d.ts

export default class MyClass {
  hello(name: string): void;
}

You can then import it into your TypeScript like this.

/// <reference path="./myClass/index.d.ts" />
import MyClass from "./myClass";

const my = new MyClass();
my.hello("Stack Overflow");