Why does my code return "Unexpected token ="?

Issue

I am working on Discord.TS bot but when I launch it with ts-node src/index.ts, I see the error

/home/negative/Dev/JS/Bot/src/structures/Client.ts:10
    commands = new discord_js_1.Collection();
             ^

SyntaxError: Unexpected token =
    at Module._compile (internal/modules/cjs/loader.js:723:23)
    at Module.m._compile (/home/negative/Dev/JS
...

Here is my code (Client.ts)

import {
    ApplicationCommandDataResolvable,
    Client,
    ClientEvents,
    Collection
} from "discord.js";
import { CommandType } from "../typings/Command";
import glob from "glob";
import { promisify } from "util";
import { RegisterCommandsOptions } from "../typings/client";
import { Event } from "./Event";

const globPromise = promisify(glob);
export class ExtendedClient extends Client {
    commands: Collection<string, CommandType> = new Collection();

    constructor() {
        super({ intents: 32767 });
    }

    start() {
        this.registerModules();
        this.login(process.env.botToken);
    }
    async importFile(filePath: string) {
        return (await import(filePath))?.default;
    }

    async registerCommands({ commands, guildId }: RegisterCommandsOptions) {
        if (guildId) {
            this.guilds.cache.get(guildId)?.commands.set(commands);
            console.log(`Registering commands to ${guildId}`);
        } else {
            this.application?.commands.set(commands);
            console.log("Registering global commands");
        }
    }

    async registerModules() {
        // Commands
        const slashCommands: ApplicationCommandDataResolvable[] = [];
        const commandFiles = await globPromise(
            `${__dirname}/../commands/*/*{.ts,.js}`
        );
        commandFiles.forEach(async (filePath) => {
            const command: CommandType = await this.importFile(filePath);
            if (!command.name) return;
            console.log(command);

            this.commands.set(command.name, command);
            slashCommands.push(command);
        });

        this.on("ready", () => {
            this.registerCommands({
                commands: slashCommands,
                guildId: process.env.guildId
            });
        });

        // Event
        const eventFiles = await globPromise(
            `${__dirname}/../events/*{.ts,.js}`
        );
        eventFiles.forEach(async (filePath) => {
            const event: Event<keyof ClientEvents> = await this.importFile(
                filePath
            );
            this.on(event.event, event.run);
        });
    }
}

The Visual Studio Code says that my code has no errors, but I can not fix this one. Can someone please tell me how to fix it? I have been working on this problem... If you know how to fix this, please tell, I will be really please to you.

Solution

This error is because you are targeting a JavaScript version that isn't supported by your installed Node.js version. You can either change the JavaScript version you are targeting, or update your Node.js version.

Option 1: Updating Node.js Version

Make sure you have installed at least Node.js version 16.11.0 (according to node.green this is the first version to fully support instance class fields).

You can check your node version by typing node -v in your terminal.

$ node -v
v17.1.0

You can then install the latest Node.js version from their website: https://nodejs.org/

Option 2: Changing Target JavaScript Version

Open your tsconfig.json file and change the target field to a version that is supported by your current Node.js version.

You can check your node version by typing node -v in your terminal.

$ node -v
v17.1.0

Consult node.green to determine what JavaScript version you can target based on your current Node.js version.

Answered By - Olian04