0

I have a javascript file from a dependency text-readability that I installed that contains the following code:

const readability = new Readability()
module.exports = readability

How do I generate Typescript typings for this? The documentation is extensive but overly complicated and does not seem to address this use case.

I can't find an example anywhere how to type an already instantiated object like this.

Also it's not clear how to call this type file or where to put it in my own project.

Alper
  • 3,424
  • 4
  • 39
  • 45
  • Does this answer your question? [typescript declare third party modules](https://stackoverflow.com/questions/44058101/typescript-declare-third-party-modules) – Jared Smith Nov 08 '20 at 12:54
  • Maybe but it's so obtuse for something that maybe should be easy? Like: where do I put the file? And even there the class is not created in the module but creatable after import? – Alper Nov 08 '20 at 13:08
  • If this is your code you're typing for your consumers the `.d.ts` file goes in the same directory as the Javascript file it references. If it's a third-party library you're trying to use in your Typescript project it goes in the @types directory. And the export has the type Readability. – Jared Smith Nov 08 '20 at 17:47
  • Thanks, but it's still super unclear. I'll have to live with `any` for now then. – Alper Nov 08 '20 at 23:42
  • I make a `@types` directory in my project root? Like what…? I also can't find any documentation on this. – Alper Nov 08 '20 at 23:59
  • It depends. Again, *is this your code you wrote, or a library you installed through npm*? You don't say, and it matters to the answer to your question which it is. – Jared Smith Nov 09 '20 at 01:30
  • I have a project and I `npm install`ed a very small library. I'd like to add the typing locally in my project. – Alper Nov 09 '20 at 09:01
  • 1
    Then yes you will need to create a directory in your project @types and a subdirectory inside it for the specific library you are adding types for. Then you'll need the index.d.ts file in that directory. In your specific case it would contain something like `declare class Readability blah blah; declare const readability: Readability; export default readability;` This is all well covered by the [official documentation for module declarations](https://www.typescriptlang.org/docs/handbook/declaration-files/templates/module-d-ts.html) referenced in the duplicate I linked. – Jared Smith Nov 09 '20 at 12:26
  • Thanks! I'm trying that right now. You're right that this is there, but there's so much other weird stuff, cruft and different module systems there that it's very difficult to make sense of. – Alper Nov 09 '20 at 12:39
  • Yup. Legacy cruft sucks. Breaking backwards compatibility usually sucks worse. I don't envy the folks working on web standards. – Jared Smith Nov 09 '20 at 13:43
  • Thanks anyway. Finally figured it out. – Alper Nov 10 '20 at 21:14

1 Answers1

0

Not at all obvious how to do this but after a bunch of back and forth, here is the full solution that will undoubtedly help others as well.

A file called text-readability.d.ts in src/:

declare module 'text-readability' {
    class Readability {
        textStandard(text: string, floatOutput?: boolean): string | number;
    }

    const readability: Readability;

    export = readability;
}

And then in the Typescript file itself, the following import and you're good to go:

/// <reference path="text-readability.d.ts"/>
import { readability } from "text-readability";
Alper
  • 3,424
  • 4
  • 39
  • 45