Error in Discord.js Guide: The Client<boolean> type does not have a 'commands' property in Typescript

Question

Error in Discord.js Guide: The Client<boolean> type does not have a 'commands' property in Typescript

node:v16.11.0

"discord.js": "^13.2.0"

I am currently setting up a Discord bot example using Discord.js.

Following the steps outlined in this guide, I have reached the point of adding the line below:

client.commands = new Collection();

However, when I do this, Typescript throws an error:

Property 'commands' does not exist on type 'Client<boolean>'

Although I found a potential solution in this answer, I still encounter some difficulties. When attempting to extend the existing type with a

declare module "discord.js"

and defining new typings, it seems to overwrite instead of extending. Furthermore, my custom typings file doesn't recognize what a Collection is since it's specific to the updated Discord.js library. This makes me question whether such modifications should be necessary following an official guide.

If you've faced similar challenges while creating a typescript Discord bot and have discovered a more recent solution, I would greatly appreciate any insights or suggestions.

Thank you for taking the time to read this.

typescript discord discord.js

Answer 1

Answer №1

-Update-

Recently, I came across my own question while searching and realized that my initial answer was incorrect. The error we encounter when following the Discord.js guide is due to the absence of a commands property on the Client class. This discrepancy is highlighted by Typescript.

After configuring Typescript correctly for my project, adding the commands as a Collection<any, any> resolved the issue.

src/@types/discord.d.ts

import { Collection } from "discord.js";

declare module "discord.js" {
  export interface Client {
    commands: Collection<any, any>;
  }
}

tsconfig.json

{
  "compilerOptions": {
    "typeRoots": ["src/@types", "node_modules/@types"],
    "outDir": "dist"
  },
  "include": ["src"],
  "exclude": ["node_modules"],
  "extends": "@tsconfig/node18/tsconfig.json"
}

-Previous Answer-

I finally found the solution.

Create types/common/discord.d.ts

And avoid making the same mistake I did by just including this:

declare module "discord.js" {
    export interface Client {
        commands: Collection<unknown, any>
    }
}

Ensure this is at the beginning.

import { Collection } from "discord.js";

This will properly extend the existing definition and incorporate Collection without replacing it.

To make this solution work, I had to add

"@typescript-eslint/no-explicit-any": "off"

to es-lint, due to Collection extending Map and allowing any value.

Answer 2

-Update-

Recently, I came across my own question while searching and realized that my initial answer was incorrect. The error we encounter when following the Discord.js guide is due to the absence of a commands property on the Client class. This discrepancy is highlighted by Typescript.

After configuring Typescript correctly for my project, adding the commands as a Collection<any, any> resolved the issue.

src/@types/discord.d.ts

import { Collection } from "discord.js";

declare module "discord.js" {
  export interface Client {
    commands: Collection<any, any>;
  }
}

tsconfig.json

{
  "compilerOptions": {
    "typeRoots": ["src/@types", "node_modules/@types"],
    "outDir": "dist"
  },
  "include": ["src"],
  "exclude": ["node_modules"],
  "extends": "@tsconfig/node18/tsconfig.json"
}

-Previous Answer-

I finally found the solution.

Create types/common/discord.d.ts

And avoid making the same mistake I did by just including this:

declare module "discord.js" {
    export interface Client {
        commands: Collection<unknown, any>
    }
}

Ensure this is at the beginning.

import { Collection } from "discord.js";

This will properly extend the existing definition and incorporate Collection without replacing it.

To make this solution work, I had to add

"@typescript-eslint/no-explicit-any": "off"

to es-lint, due to Collection extending Map and allowing any value.

Answer 3

Answer №2

When faced with a choice, you can either take the difficult route or opt for the simpler path. The challenging option involves:

declare module "discord.js" {
  export interface Client {
    commands: Collection<unknown, any>
  }
}

Alternatively, the easier approach is to enhance the discord class as commonly practiced by many:

// utils/Client.ts
import { Client, Collection } from "discord.js"

export default class MyClient extends Client {
  collection: Collection<any, any> // make sure to use correct type :)
  constructor(options) {
   super(options)
   this.collection = new Collection();
   this.loadCommands()
  }
  loadCommands() {
   // add your code here
  }
}

Answer 4

When faced with a choice, you can either take the difficult route or opt for the simpler path. The challenging option involves:

declare module "discord.js" {
  export interface Client {
    commands: Collection<unknown, any>
  }
}

Alternatively, the easier approach is to enhance the discord class as commonly practiced by many:

// utils/Client.ts
import { Client, Collection } from "discord.js"

export default class MyClient extends Client {
  collection: Collection<any, any> // make sure to use correct type :)
  constructor(options) {
   super(options)
   this.collection = new Collection();
   this.loadCommands()
  }
  loadCommands() {
   // add your code here
  }
}

Answer 5

Answer №3

According to the guidelines provided in their documentation, it is recommended to extend the base Client and typecast it to include the commands property. To do this, you can create a new interface like so:

interface ClientWithCommands extends Client {
  commands: Collection<string, any>
}

Once the interface is defined, you can proceed by typecasting the Client instance using the "as" keyword:

const client = new Client({
  intents: [
    GatewayIntentBits.Guilds,
  ],
}) as ClientWithCommands

Now that the typecasting is done, you can start adding your commands as shown below:

client.commands = new Collection()
...

Answer 6

According to the guidelines provided in their documentation, it is recommended to extend the base Client and typecast it to include the commands property. To do this, you can create a new interface like so:

interface ClientWithCommands extends Client {
  commands: Collection<string, any>
}

Once the interface is defined, you can proceed by typecasting the Client instance using the "as" keyword:

const client = new Client({
  intents: [
    GatewayIntentBits.Guilds,
  ],
}) as ClientWithCommands

Now that the typecasting is done, you can start adding your commands as shown below:

client.commands = new Collection()
...

Answer 7

Answer №4

While the question may have already been addressed, here's a simple solution for those who prefer not to import additional libraries:

module "discord.js" {
    export interface Client {
        foo: number;
    }
}

export {}

Answer 8

While the question may have already been addressed, here's a simple solution for those who prefer not to import additional libraries:

module "discord.js" {
    export interface Client {
        foo: number;
    }
}

export {}

Error in Discord.js Guide: The Client<boolean> type does not have a 'commands' property in Typescript

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Modifying audio output in a React element

What is the reason behind a number having its final two digits transformed into zeros?

Can child components forward specific events to their parent component?

What is the correct way to utilize the createAsyncThunk function in TypeScript?

The attributes of a Mongoose are represented as Document instances rather than simple values

Tips for updating ion-select option to correspond with the object by utilizing the object's identifier as the value

Is there a way to customize the "instanceof" functionality for an ArrayBuffer?

Exporting stylesheets in React allows developers to separate

Access an Angular 2 component through an email hyperlink including querystring parameters

imported classes from a module cannot be accessed within the same module

For every piece of information in the reply

Having trouble locating the error in my Angular and Spring Security application

Using Typescript with Angular 2 to Implement Google Sign-In on Websites

Encountered "Function undefined error when invoking within a map in TypeScript"

Obtaining the date input value from the ng2-date-picker component in Angular2

An error occured in angular2: Cannot access the 'title' property of undefined

An error in npm occurred: "The name "@types/handlebars" is invalid."

What is the reason behind TypeScript choosing to define properties on the prototype rather than the object itself?

Creating a Union Type from a JavaScript Map in Typescript

Properly passing props to child components in React with TypeScript. Resolve Error ts(2322)