12 replies

Issue with path aliases not working when using imports (TypeScript)

Not sure what exactly is going on, normally I'm only using TS paths like

"@lib/*": ["src/lib/*"]

"@lib/*": ["src/lib/*"]

but I wanted to start implementing something similar in my bot to make it so I don't have a bunch of

../../../

../../../

and whatnot when I'm having to import certain types/classes/etc..

Never had any issues with this while using NextJS, but I assume this has to be an issue with my tsconfig/package.json files. This is the error I'm getting at the moment:

[4:56:11 AM] Starting compilation in watch mode...

[4:56:16 AM] Found 0 errors. Watching for file changes.

node:internal/modules/cjs/loader:1147
  throw err;
  ^

Error: Cannot find module '@lib/utils'
Require stack:
- /home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/index.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/client.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/index.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1144:15)
    at Module._load (node:internal/modules/cjs/loader:985:27)
    at Module.require (node:internal/modules/cjs/loader:1235:19)
    at require (node:internal/modules/helpers:176:18)
    at Object.<anonymous> (/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js:5:17)
    at Module._compile (node:internal/modules/cjs/loader:1376:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
    at Module.load (node:internal/modules/cjs/loader:1207:32)
    at Module._load (node:internal/modules/cjs/loader:1023:12)
    at Module.require (node:internal/modules/cjs/loader:1235:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/index.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/client.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/index.js'
  ]
}

[4:56:11 AM] Starting compilation in watch mode...

[4:56:16 AM] Found 0 errors. Watching for file changes.

node:internal/modules/cjs/loader:1147
  throw err;
  ^

Error: Cannot find module '@lib/utils'
Require stack:
- /home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/index.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/client.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/index.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1144:15)
    at Module._load (node:internal/modules/cjs/loader:985:27)
    at Module.require (node:internal/modules/cjs/loader:1235:19)
    at require (node:internal/modules/helpers:176:18)
    at Object.<anonymous> (/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js:5:17)
    at Module._compile (node:internal/modules/cjs/loader:1376:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
    at Module.load (node:internal/modules/cjs/loader:1207:32)
    at Module._load (node:internal/modules/cjs/loader:1023:12)
    at Module.require (node:internal/modules/cjs/loader:1235:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/index.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/client.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/index.js'
  ]
}

Currently this is my tsconfig.json:

{
    "extends": ["@sapphire/ts-config", "@sapphire/ts-config/extra-strict", "@sapphire/ts-config/decorators"],
    "compilerOptions": {
        "baseUrl": ".",
        "module": "CommonJS",
        "moduleResolution": "Node",
        "rootDir": "src",
        "outDir": "dist",
        "experimentalDecorators": true,
        "esModuleInterop": true,
        "resolveJsonModule": true,
        "tsBuildInfoFile": "dist/.tsbuildinfo",
        "paths": {
            "@lib/*": ["src/lib/*"]
        }
    },

    "include": ["src"],
    "compileOnSave": true
}

{
    "extends": ["@sapphire/ts-config", "@sapphire/ts-config/extra-strict", "@sapphire/ts-config/decorators"],
    "compilerOptions": {
        "baseUrl": ".",
        "module": "CommonJS",
        "moduleResolution": "Node",
        "rootDir": "src",
        "outDir": "dist",
        "experimentalDecorators": true,
        "esModuleInterop": true,
        "resolveJsonModule": true,
        "tsBuildInfoFile": "dist/.tsbuildinfo",
        "paths": {
            "@lib/*": ["src/lib/*"]
        }
    },

    "include": ["src"],
    "compileOnSave": true
}

If needed I can share my package.json as well. Just not sure what I'm what I'm doing wrong here... This is a real pain because I just started using eslint more to improve my code and so I'm doing a lot of refactoring and.. yeah. Considering my codebase it's a bit overwhelming. I'd like to figure out how to get these ts paths working though if possible.

Solution

The error is a NodeJS runtime error. Not a TS compile error. TS doesn't recalculate aliases and output resolved paths. You need to also configure your aliases in package.json subpath imports. Note that you also need to switch to # instead of @ then because that's what node requires. https://nodejs.org/api/packages.html#subpath-imports

You can look at various examples from /tag bots ( @Spinel command)

Jump to solution

Issue with path aliases not working when using imports (TypeScript)

Not sure what exactly is going on, normally I'm only using TS paths like

"@lib/*": ["src/lib/*"]

"@lib/*": ["src/lib/*"]

but I wanted to start implementing something similar in my bot to make it so I don't have a bunch of

../../../

../../../

[4:56:11 AM] Starting compilation in watch mode...

[4:56:16 AM] Found 0 errors. Watching for file changes.

node:internal/modules/cjs/loader:1147
  throw err;
  ^

Error: Cannot find module '@lib/utils'
Require stack:
- /home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/index.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/client.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/index.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1144:15)
    at Module._load (node:internal/modules/cjs/loader:985:27)
    at Module.require (node:internal/modules/cjs/loader:1235:19)
    at require (node:internal/modules/helpers:176:18)
    at Object.<anonymous> (/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js:5:17)
    at Module._compile (node:internal/modules/cjs/loader:1376:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
    at Module.load (node:internal/modules/cjs/loader:1207:32)
    at Module._load (node:internal/modules/cjs/loader:1023:12)
    at Module.require (node:internal/modules/cjs/loader:1235:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/index.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/client.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/index.js'
  ]
}

[4:56:11 AM] Starting compilation in watch mode...

[4:56:16 AM] Found 0 errors. Watching for file changes.

node:internal/modules/cjs/loader:1147
  throw err;
  ^

Error: Cannot find module '@lib/utils'
Require stack:
- /home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/index.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/client.js
- /home/doc/Documents/Projects/WebDev/Robot/dist/index.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1144:15)
    at Module._load (node:internal/modules/cjs/loader:985:27)
    at Module.require (node:internal/modules/cjs/loader:1235:19)
    at require (node:internal/modules/helpers:176:18)
    at Object.<anonymous> (/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js:5:17)
    at Module._compile (node:internal/modules/cjs/loader:1376:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
    at Module.load (node:internal/modules/cjs/loader:1207:32)
    at Module._load (node:internal/modules/cjs/loader:1023:12)
    at Module.require (node:internal/modules/cjs/loader:1235:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/DatabaseService.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/lib/guild/user/index.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/client.js',
    '/home/doc/Documents/Projects/WebDev/Robot/dist/index.js'
  ]
}

Currently this is my tsconfig.json:

{
    "extends": ["@sapphire/ts-config", "@sapphire/ts-config/extra-strict", "@sapphire/ts-config/decorators"],
    "compilerOptions": {
        "baseUrl": ".",
        "module": "CommonJS",
        "moduleResolution": "Node",
        "rootDir": "src",
        "outDir": "dist",
        "experimentalDecorators": true,
        "esModuleInterop": true,
        "resolveJsonModule": true,
        "tsBuildInfoFile": "dist/.tsbuildinfo",
        "paths": {
            "@lib/*": ["src/lib/*"]
        }
    },

    "include": ["src"],
    "compileOnSave": true
}

{
    "extends": ["@sapphire/ts-config", "@sapphire/ts-config/extra-strict", "@sapphire/ts-config/decorators"],
    "compilerOptions": {
        "baseUrl": ".",
        "module": "CommonJS",
        "moduleResolution": "Node",
        "rootDir": "src",
        "outDir": "dist",
        "experimentalDecorators": true,
        "esModuleInterop": true,
        "resolveJsonModule": true,
        "tsBuildInfoFile": "dist/.tsbuildinfo",
        "paths": {
            "@lib/*": ["src/lib/*"]
        }
    },

    "include": ["src"],
    "compileOnSave": true
}

Solution

Jump to solution

Issue with path aliases not working when using imports (TypeScript)

Issue with path aliases not working when using imports (TypeScript)

Similar Threads

Similar Threads

Similar Threads