Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Invalid imports in generated d.ts for project with tsconfig path alias defined for any module #330

Open
3 tasks done
k-i-m opened this issue May 16, 2024 · 0 comments
Open
3 tasks done
Labels
bug Something isn't working

Comments

@k-i-m
Copy link

k-i-m commented May 16, 2024

Describe the bug

I have a project, where I have path aliases defined in tsconfig.json to simplify usage of any module within src folder:

    "paths": {
      "*": ["src/*"],
    },

This setting allows to simplify the imports, so that instead of:
import { Sample } from 'src/components/Sample'; (or even import { Sample } from '@/components/Sample';)
we can use:
import { Sample } from 'components/Sample';

When I build the app, the app itself works fine (thanks to the vite-tsconfig-paths), but all the d.ts files for .ts files that are inside a subfolder of src, are generated with invalid import paths.

The original ts file:
image
The output d.ts file:
image

It was working fine in vite-plugin-dts@3.6.4. Any version since then (so starting from v3.7.0) has the issue.
Possibly there is an issue in this commit that was introduced in 3.7.0:
e8827cb

Reproduction

https://stackblitz.com/edit/vitejs-vite-sg53ed?file=dist%2Ftypes%2Fcomponents%2FSample%2Findex.d.ts

Steps to reproduce

  • create sample app (react based for example), with vite + vite-plugin-dts + vite-tsconfig-paths
  • create any subfolder (like "components") inside src, and there create any other folder containing some sample component:
src
- components
-- Sample
--- Sample.tsx
--- index.ts

where index.ts is only reexporting the component

export * from './Sample';
  • import the component in App.tsx: import { Sample } from 'components/Sample';

  • set the project's configuration:

package.json
vite related libraries:

    "vite": "^5.2.0",
    "vite-plugin-dts": "^3.9.1",
    "vite-tsconfig-paths": "^4.3.2"

tsconfig.json
add the following "paths":

    "paths": {
      "*": ["src/*"],
    }

vite.config.ts

import * as path from 'path';
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import dts from 'vite-plugin-dts';
import tsconfigPaths from 'vite-tsconfig-paths';

import * as packageJSON from './package.json';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    react(),
    dts({
      entryRoot: path.resolve(__dirname, 'src'),
      outDir: path.resolve(__dirname, 'dist', 'types'),
    }),
    tsconfigPaths(),
  ],
  build: {
    rollupOptions: {
      external: Object.keys(packageJSON.dependencies),
    },
  },
});
  • run vite build command
  • in dist/types folder you will find d.ts files with invalid import paths

System Info

System:
    OS: Windows 11 10.0.22621
    CPU: (20) x64 13th Gen Intel(R) Core(TM) i7-13800H
    Memory: 13.18 GB / 31.66 GB
  Binaries:
    Node: 18.20.2 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.22 - C:\Program Files\nodejs\yarn.CMD
    npm: 10.5.0 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.1.1 - C:\Program Files\nodejs\pnpm.CMD
  Browsers:
    Edge: Chromium (123.0.2420.97)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    @vitejs/plugin-react: ^4.2.1 => 4.2.1
    vite: ^5.2.0 => 5.2.11
    vite-plugin-dts: ^3.9.1 => 3.9.1

Validations

@qmhc qmhc added the bug Something isn't working label May 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants