Support for typescript tsconfig paths?

[deniz-blue]

I'm building a new project and I wanted to use dynohot and decided to go with @loaderkit/ts too. However, it seems that it doesnt support tsconfig.json's compilerOptions.paths feature. Will this be supported? Are there any workarounds?

[laverdet]

I'm guessing you mean paths in the way described by this StackOverflow answer? https://stackoverflow.com/questions/43281741/how-can-i-use-paths-in-tsconfig-json/43330003#43330003

The technique described here is actually really bad advice but it's been repeated and has unfortunately made its way into lots of tooling. Instead I recommend "Subpath Imports" which is described in the nodejs documentation and is well-supported by all bundlers and doesn't rely on unspecified guesswork. https://nodejs.org/api/packages.html#subpath-imports

The paths property in tsconfig.json is meant for directing the internal TypeScript resolution algorithm only. It was never meant to direct runtime or compile-time resolution logic of stripped sources, and it fails at this purpose.

[deniz-blue]

Thank you! Will use that from now on.

Do you also happen to know how I can implement tsconfig rootDirs ?

I'm trying to do something that react-router v7 framework does:

// test.tsx
import type { Route } from "./+types/test";
export default Component(props: Route.ComponentProps) { ... }

// .react-router/types/+types/test.ts
export namespace Route { ... }

// tsconfig.json
"rootDirs": [
  ".",
  "./.react-router/types"
]

But since this is also a typescript misused feature (i assume) this is also unsupported with @loaderkit/ts...

[laverdet]

rootDirs is fine, and is supported in this loader. We just take the first entry from rootDirs and use that as the canonical runtime location. Do you have a case where it does not work correctly?

[laverdet]

See:

loaderkit/packages/ts/utility/scope.ts

Lines 184 to 186 in a74fe34

	if (compilerOptions.rootDirs) {
	return makeLocation(compilerOptions.rootDirs[0]!, configPath);
	} else if (compilerOptions.rootDir === undefined) {

[deniz-blue]

If you intend to only use the first entry in rootDirs, it works as intended.
Let me break down the example above:

• file /test.tsx relative imports type Route from ./+types/test
  • /+types/test.* does not exist (@loaderkit/ts tries to import this and fails!)
  • rootDirs[1] == "./.react-router/types"
  • /.react-router/types/+types/test.* does exist, so typescript does not complain (however @loaderkit/ts does not realize this)

I hope my explanation is clear 🙏

[laverdet]

This case should work. Since your import is only a type it will be omitted in the transpiled output.

I added a test case to show what it might look like: 9ba9499

If possible could you provide a complete example that fails? Either a gist w/ a complete project, a sample repo, or a test case that fails like the one I just created.