Ways to enhance a class that is declared but not exported in a Typescript module

Question

Ways to enhance a class that is declared but not exported in a Typescript module

The hubot type definitions contain the following class:

declare namespace Hubot {
    // ...

    class Message {
        user: User;
        text: string;
        id: string;
    }

    // ...
}

// Compatibility with CommonJS syntax exported by Hubot's CoffeeScript.
// tslint:disable-next-line export-just-namespace
export = Hubot;
export as namespace Hubot;

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a6b283d1d43d8c7c82a4a4e22d0fc27c9964154c/types/hubot/index.d.ts#L18-L22

I am looking to extend the Message class within my code, in a file called hubot.d.ts:

import * as hubot from 'hubot';

declare namespace Hubot {
  export class Message {
    mentions: string[]
  }
}

However, it is not functioning as expected: https://i.sstatic.net/ox5DM.png

The hubot.d.ts file has been included in the code through

  "files": ["types/custom/hubot.d.ts"]

In the tsconfig.json file.

What am I overlooking? Is there another approach I should consider?

javascript typescript types

Answer 1

Answer №1

hubot.d.ts must contain the following:

// This import does not have a purpose other than making the file a module
// (in order for the next statement to be a module augmentation rather than a module declaration) and could be replaced with `export {}`.
import * as hubot from 'hubot';

declare module "hubot" {
  interface Message {
    mentions: string[]
  }
}

An augmentation of the module is necessary to add declarations to the hubot module. Since the Hubot namespace is set as the export of the module, any augmentations made to the module will directly target that namespace; introducing another namespace Hubot { ... } in the augmentation would create a nested namespace, which is not desired. Lastly, declaring a class results in a "duplicate identifier" error, whereas declaring an interface is sufficient for adding properties.

Answer 2

hubot.d.ts must contain the following:

// This import does not have a purpose other than making the file a module
// (in order for the next statement to be a module augmentation rather than a module declaration) and could be replaced with `export {}`.
import * as hubot from 'hubot';

declare module "hubot" {
  interface Message {
    mentions: string[]
  }
}

An augmentation of the module is necessary to add declarations to the hubot module. Since the Hubot namespace is set as the export of the module, any augmentations made to the module will directly target that namespace; introducing another namespace Hubot { ... } in the augmentation would create a nested namespace, which is not desired. Lastly, declaring a class results in a "duplicate identifier" error, whereas declaring an interface is sufficient for adding properties.

Ways to enhance a class that is declared but not exported in a Typescript module

Answer №1

Similar questions

Problem with the WP Rocket helper plugin that excludes JS scripts from Delay JS only at specific URLs

Confirming that a lengthy string contains a sufficient number of breakable spaces for proper presentation

How come I lose a day when attempting to convert a date to an ISO string in JavaScript?

How to programmatically unselect an ng-checkbox in AngularJS when it is removed from an array

Mobile device scrolling glitch

The error message "Unable to execute stripe.customers.createBalanceTransaction function" is displayed on

A guide to generating numerous SVG paths using a JavaScript function

The lack of functionality for lockOrientation in Cordova is causing issues

Tips for integrating automatic form validation in forms with nested components

Exploring Angular's Dependency Injection

The problem with Typescript's RXJS `distinctUntilChanged` arises when the strictness of the parameter is set to undefined

Issue 2339: Dealing with || and Union Types

ever-evolving background-image with dynamic CSS styling

Creating an ngFor loop with an ngIf condition for true and false bot conditions

How can TypeScript be effectively utilized with global packages?

Function that contains a JavaScript reference and observation

"Enhance Your Online Shopping Experience with Woocommerce Ajax Filters and

Automatically updating the date value in one matDatePicker field will impact the date in another matDatePicker field within a Reactive Form

Running a Jest test that triggers process.exit within an eternal setInterval loop with a latency of 0, all while utilizing Single

Tips for calculating the total count of a specific field within a JSON array with TypeScript