Can't create plugins with typescript

[remborg]

Using cheerio with typescript works fine until I try to create a plugin:

import cheerio from 'cheerio';

const html: string = `
<ul id="fruits">
    <li class="apple">Apple</li>
    <li class="orange">Orange</li>
    <li class="pear">Pear</li>
</ul>`;

const $ = cheerio.load(html, {
    normalizeWhitespace: true
});

$.prototype.logHtml = function () {
    console.log(this.html());
};

$('#fruits').logHtml();

Typescript returns me error:

Property 'logHtml' does not exist on type 'Cheerio'.ts(2339)

This is normal, since logHtml is not part of '@types/cheerio'. So I've tried to do some module augmentation by adding this after the import:

declare module "cheerio" {
    interface Cheerio {
        logHtml(): void
    }
}

The previous error is still there and I get a new one:

Cannot augment module 'cheerio' because it resolves to a non-module entity.ts(2671)

I'm I doing something wrong or is this an issue with the way the module is created?

EDIT: I'm using node v12.16.3, tsc v3.9.3, @types/cheerio v0.22.18 and cheerio v1.0.0-rc.3

[remborg]

I've found a similar issue in another library:
googleapis/google-auth-library-nodejs#177

A workaround here is to use the require syntax const cheerio = require('cheerio'); instead of the import .
Not great but typescript doesn't complain anymore. You loose intellisense in vs-code too.

My tsconfig file is as follow:

{
    "compilerOptions": {
        "module": "commonjs",
        "rootDir": "src",
        "moduleResolution": "node",
        "allowSyntheticDefaultImports": true,
        "esModuleInterop": true,
        "noImplicitAny": true,
    },
    "include": [
        "src/"
    ],
    "exclude": [
        "node_modules"
    ]
}

[fb55]

Typescript interfaces are open, so you should be able to add methods to them like this.

[remborg]

Thanks for the link but this solution doesn't work.
vscode tells me that the new interface is Cheerio' is declared but never used.ts(6196)
And the custom function still has 'Property logHtml' does not exist on type 'Cheerio'.ts(2339)

Here is the full code:

import cheerio from 'cheerio';

const html: string = `
<ul id="fruits">
<li class="apple">Apple</li>
<li class="orange">Orange</li>
<li class="pear">Pear</li>
</ul>
`;
const $ = cheerio.load(html, {
    normalizeWhitespace: true
});

interface Cheerio {
    logHtml(): void
}

$.prototype.logHtml = function () {
    console.log(this.html());
};

$('#fruits').logHtml();

[remborg]

I've managed to get typescript happy, thanks to this post: microsoft/TypeScript#7148 (comment)

I had to define my plugin globally with:

declare global {
    interface Cheerio {
        logHtml(): void
    }
}

[fb55]

Awesome, thanks for updating @remborg!