radix-vue / shadcn-vue

Vue port of shadcn-ui
https://www.shadcn-vue.com/
MIT License
3.48k stars 203 forks source link

[Bug]: vue-tsc Cannot find module './Button.vue' or its corresponding type declarations. #627

Open frenicohansen opened 1 week ago

frenicohansen commented 1 week ago

Reproduction

https://codesandbox.io/p/devbox/jovial-hertz-ktj475

Describe the bug

The errors show up directly after trying to start the Nuxt.js app

Console's log

Nuxt 3.12.2 with Nitro 2.9.6                                                     10:36:22 AM
                                                                                 10:36:23 AM
  ➜ Local:    http://localhost:3000/
  ➜ Network:  use --host to expose

[10:36:24 AM]  WARN  [nuxt] Expected @nuxt/kit to be at least 3.12.2 but got 3.12.1. This might lead to unexpected behavior. Check your package.json or refresh your lockfile.

[10:36:24 AM]  WARN  [nuxt] Expected @nuxt/schema to be at least 3.12.2 but got 3.12.1. This might lead to unexpected behavior. Check your package.json or refresh your lockfile.

ℹ Using Tailwind CSS from ~/assets/css/tailwind.css            nuxt:tailwindcss 10:36:24 AM
  ➜ DevTools: press Shift + Alt + D in the browser (v1.3.3)                      10:36:26 AM

ℹ Tailwind Viewer: http://localhost:3000/_tailwind/            nuxt:tailwindcss 10:36:27 AM
ℹ Re-optimizing dependencies because lockfile has changed                       10:36:28 AM
ℹ Vite server warmed up in 3954ms                                               10:36:32 AM
ℹ Vite client warmed up in 4717ms                                               10:36:32 AM
✔ Nuxt Nitro server built in 1636 ms                                      nitro 10:36:33 AM

 ERROR                                                                           10:36:36 AM
 ERROR(vue-tsc)  Cannot find module './Button.vue' or its corresponding type declarations.
 FILE  /project/workspace/components/ui/button/index.ts:3:35

    1 | import { type VariantProps, cva } from 'class-variance-authority'
    2 |
  > 3 | export { default as Button } from './Button.vue'
      |                                   ^^^^^^^^^^^^^^
    4 |
    5 | export const buttonVariants = cva(
    6 |   'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',

 ERROR(vue-tsc)  Cannot find module './Tooltip.vue' or its corresponding type declarations.
 FILE  /project/workspace/components/ui/tooltip/index.ts:1:36

  > 1 | export { default as Tooltip } from './Tooltip.vue'
      |                                    ^^^^^^^^^^^^^^^
    2 | export { default as TooltipContent } from './TooltipContent.vue'
    3 | export { default as TooltipTrigger } from './TooltipTrigger.vue'
    4 | export { default as TooltipProvider } from './TooltipProvider.vue'

 ERROR(vue-tsc)  Cannot find module './TooltipContent.vue' or its corresponding type declarations.
 FILE  /project/workspace/components/ui/tooltip/index.ts:2:43

    1 | export { default as Tooltip } from './Tooltip.vue'
  > 2 | export { default as TooltipContent } from './TooltipContent.vue'
      |                                           ^^^^^^^^^^^^^^^^^^^^^^
    3 | export { default as TooltipTrigger } from './TooltipTrigger.vue'
    4 | export { default as TooltipProvider } from './TooltipProvider.vue'
    5 |

 ERROR(vue-tsc)  Cannot find module './TooltipTrigger.vue' or its corresponding type declarations.
 FILE  /project/workspace/components/ui/tooltip/index.ts:3:43

    1 | export { default as Tooltip } from './Tooltip.vue'
    2 | export { default as TooltipContent } from './TooltipContent.vue'
  > 3 | export { default as TooltipTrigger } from './TooltipTrigger.vue'
      |                                           ^^^^^^^^^^^^^^^^^^^^^^
    4 | export { default as TooltipProvider } from './TooltipProvider.vue'
    5 |

 ERROR(vue-tsc)  Cannot find module './TooltipProvider.vue' or its corresponding type declarations.
 FILE  /project/workspace/components/ui/tooltip/index.ts:4:44

    2 | export { default as TooltipContent } from './TooltipContent.vue'
    3 | export { default as TooltipTrigger } from './TooltipTrigger.vue'
  > 4 | export { default as TooltipProvider } from './TooltipProvider.vue'
      |                                            ^^^^^^^^^^^^^^^^^^^^^^^
    5 |

[vue-tsc] Found 5 errors. Watching for file changes.

System Info

System:
    OS: Linux 6.1 Debian GNU/Linux 12 (bookworm) 12 (bookworm)
    CPU: (2) x64 AMD EPYC
    Memory: 1.67 GB / 4.01 GB
    Container: Yes
    Shell: Unknown
  Binaries:
    Node: 20.9.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.8.1 - /usr/local/bin/npm
    pnpm: 8.10.2 - /usr/local/share/npm-global/bin/pnpm
  npmPackages:
    nuxt: ^3.12.2 => 3.12.2 
    radix-vue: ^1.8.4 => 1.8.4 
    shadcn-nuxt: ^0.10.4 => 0.10.4 
    vue: ^3.4.29 => 3.4.29

Contributes

FiNGAHOLiC commented 1 week ago

+1

9mm commented 6 days ago

also getting this on the day i decide ot try shadcn-vue, thought i be crazy

9mm commented 5 days ago

This issue drove me insane for hours, I finally sorted it I think. I don't know if this is the "proper" way, but after seeing tons of old outdated Vue 2 answers dealing with shims, I just happened to stumble across this in the config, set it to true and it works great so far.

https://nuxt.com/docs/api/nuxt-config#shim

romanhrynevych commented 4 days ago

@frenicohansen there was some sort of errors with TS v5.5 in vue-tsc which was resolved in v2.0.22, I see that in your reproduction you use vue-tsc v^1 which is EOL, can you update deps (for example with taze), I think this should help you 🙌

Vue-tsc issue: https://github.com/vuejs/language-tools/issues/4487

frenicohansen commented 4 days ago

@frenicohansen there was some sort of errors with TS v5.5 in vue-tsc which was resolved in v2.0.22, I see that in your reproduction you use vue-tsc v^1 which is EOL, can you update deps (for example with taze), I think this should help you 🙌

Vue-tsc issue: vuejs/language-tools#4487

Thanks for the info. Now I think maybe this is not an issue with shadcn-vue anymore, because Nuxt doesn't support vue-tsc 2 yet.

Quoted from https://nuxt.com/docs/guide/concepts/typescript#type-checking

You may experience issues with the latest vue-tsc and vite-plugin-checker, used internally when type checking. For now, you may need to stay on v1 of vue-tsc, and follow these upstream issues for updates: fi3ework/vite-plugin-checker#306 and vuejs/language-tools#3969.

9mm commented 4 days ago

Yes i was wondering this.. there are 1 or 2 very longstanding issues which is broken by vue-tsc v2.

I also notice my volar server broke yesterday, potentially all related 🤔

9mm commented 3 days ago

Man talk about crazy. So many things broke simultaneously it took me hours to sort out what it was.

After so much looking, i see reverting back to TS 5.4 until volar pushes update fixing where it broke, will then allow all these radix errors to go away