[Feature]: Support for DTS paths replacement

[chenjiahan]

What problem does this feature solve?

The compilerOptions#paths in tsconfig.json should work for DTS output.

Modern.js Module supports this, see https://github.com/web-infra-dev/modern.js/blob/main/packages/solutions/module-tools/src/utils/dts.ts#L116

• tsconfig.json:

{
  "compilerOptions": {
    "paths": {
      "rslog": ["./compiled/rslog"]
    }
  },
  "include": ["src"]
}

• src/index.ts:

import logger from 'rslog';

• dist/index.d.ts:

import logger from '../compiled/rslog';

What does the proposed API look like?

This should work out of the box.

[Timeless0911]

Sub task of #140

[noshower]

现在 0.1.5 版本解决了值导入的别名问题，还差类型导入的别名问题没实现，加油

[tutods]

Any update on this?

[Timeless0911]

Any update on this?

Not yet, you can use tsc-alias to replace alias paths with relative paths after Rslib compilation.

[tutods]

Any update on this?

Not yet, you can use tsc-alias to replace alias paths with relative paths after Rslib compilation.

But when I try to use the tsc-alias we move all the .d.ts to dist/src while the other files are on dist root.

[Timeless0911]

But when I try to use the tsc-alias we move all the .d.ts to dist/src while the other files are on dist root.

This is usually due to tsconfig.json wrongly configured, to remove src folder level, we can configure like below:

{
  "compilerOptions": {
    "baseUrl": ".",
    "rootDir": "src",
  },
  "include": ["src"]
}

Open another issue and provide reproduction demo if you have further questions.

[lachieh]

@Timeless0911 is this something that is open for contribution? I have an POC plugin using tsc-alias that works (with the limited testing I've done)

[Timeless0911]

@Timeless0911 is this something that is open for contribution? I have an POC plugin using tsc-alias that works (with the limited testing I've done)

Yeah, PR is welcome for this feature which should be a config named redirect.dts.path.

TBH, I wanna to implement this feature by someway using AST formly. And tsc-alias is also a solution based on regular expression which may exist some edge case.

I think you can implement this feature in a simple way first, and then we can iterate on it gradually day by day.

[lachieh]

Ok great, I'll take a look. Agreed on AST implementation. Is there a recommended place to start looking into that? I hit some issues with a similar contribution to vite-plugin-dts.

There are definitely some edge cases with simple regular expressions like having paths: { "*": "./src/*" } in the tsconfig which is valid. Without some extra checks, that means that import React from "react" would get changed to import React from "./src/react".

I'll make sure to handle the same cases I covered for the vite plugin, but AST as well as some extra resolution might be required.

[fi3ework]

FWIW, es-module-lexer and cjs-modules-lexer are way cheaper and accurate to find the importing statements comparing to regex and AST parsing.

[Timeless0911]

@lachieh Hi, we need to put this feature on the agenda this quarter. I think we can first implement a simple version to ensure the availability of basic scenes, and then gradually iterate and optimize it. Are you interested in contributing a PR to implement it and then we can complete this feature together?

[lachieh]

Thanks for the ping! Apologies for not getting to it, I should be able to look at it early next week if that works?

I like the look of the lexer packages, does an implementation using those sound like a good first iteration?

[fi3ework]

It suddenly occurred to me, is it possible to achieve this through a TypeScript plugin. I'm not sure if it's possible to change the d.ts output by a TS plugin, but if it's possible, we can add the internal TS plugin as we're using TS API now.

[Timeless0911]

I think both TypeScript plugin and lexer are good for me to implement the first iteration.