Dynamic Import Hangs

[gaunt elk]

How do i do localized imports, or nested imports... dk, my brain is blanking on the right word.

[loud crag]

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import Dynamic imports

In Deno https://docs.deno.com/deploy/api/dynamic-import/

[gaunt elk]

!resolved

[gaunt elk]

!unresolve

alright, another issue with it...

for (const folder of commandFolders) {
    //
    const commandsPath = path.join(foldersPath, folder);
    const commandFiles = fs.readdirSync(commandsPath).filter((file) =>
        //Filter any and all files
        // that end with ts
        file.endsWith(".ts")
    );
    for (const file of commandFiles) {
        //Join Commands/x with /file.tx
        const filePath = path.join(commandsPath, file);

        //import the command from file
        // deno-lint-ignore prefer-const
        let command = await import("file://" + filePath) as BotCommand;

        //Add command to the list
        commands.push(command.data.toJSON());
    }
}

this is hanging at the import statement.

!helper

Dynamic Import Hangs

(sorry i pinged u)

[loud crag]

You don't need the file:// protocol, just a relative import

[gaunt elk]

if i make it all relative

[loud crag]

Yeah probably something is wrong with the path itself, try to debug it a little

[gaunt elk]

frick it im swapping this stuff to deno and if don't work then ima cri

[loud crag]

That's not an import anymore tho, it's a readFile, not really the same function

[gaunt elk]

nah im tryna read the directories to find the objects in it

so swapping to Deno.readDir is cool in this case

[loud crag]

Yeah what I meant is that you probably want to read the folder with a full path using cwd, and then import using a relative one

[gaunt elk]

yeah thats what i did now
ok now tf?

oh nvm i forgot relative thing one sec

[loud crag]

The docs say that the path must start with ./ to be recognized as relative

[gaunt elk]

ok so now im back to it hanging every time it tries to import

^ it isn't reaching the breakpoint below the import which is clear from the top right

also ignore the random console.log there

[loud crag]

The docs specifically request a template literal (I know it's silly but it has to be statically analyzed)

[gaunt elk]

i swear.

still hung

[loud crag]

Wrap it in a try catch, see what's the error

[gaunt elk]

also ignore that error, its because i referenced a variable outside of its scope

[loud crag]

Just a sanity check, if you try to manually import a file with the relative path as a static string (either dynamically or not) does it work?

[gaunt elk]

still hung

wtf is going on

[loud crag]

Well your relative path is wrong, it is relative to the current file

[loud crag]

From what I see from your screen you should go down a couple of levels

[gaunt elk]

oh crap wait...

hang on

[loud crag]

Yeps

[gaunt elk]

[loud crag]

Yeah that's a different error at least 🙂 remove the try catch, command is not defined outside of it

[gaunt elk]

yay now im on the good ol stuff

ty

!resolved

[loud crag]

Good luck!

[gaunt elk]

I'll need it

[haughty sand]

@gaunt elk TBH, highly recommend just having a static list of imports.

!*:discordjs-dynamic-imports

[spiral sundial]

retsam19#0

`!retsam19:discordjs-dynamic-imports`:

The discord.js docs recommend using fs to dynamically load and register resources (e.g. commands) within a specific folder - but this is more complex than necessary and has some footguns associated with it.

A very common issue is whether the file will have a .ts or .js extension, depending on whether the code is compiled to JS or run directly (e.g. with ts-node or tsx).

And TS does not know the contents of dynamically imported files, so you have to cast the imports (or use any) and you can have errors where the code in the file doesn't match the type you cast it to.

Instead, I recommend a static list of imports:

import FooCommand from "./commands/foo.js";
import BooCommand from "./commands/bar.js";

export const commands = [FooCommand, BarCommand];

Yes, it's 'boilerplate' but it's very simple, usually much less code than dynamic fs stuff, and TS can properly type-check it.

---

Or for an alternative structure for organizing your bot, you can check out the TS Community Discord bot: https://github.com/typescript-community/community-bot which uses a 'modules' organization.

[gaunt elk]

Neva, also its a bridged bot so it just isnt for discord

[haughty sand]

The "discord" part isn't really relevant.

It's just the most common case where people try to do this pattern.