[Help] [vite-node] [plugin:vite:vue] [VITE_ERROR] /components/ui/button/Button.vue

[ezekel]

I just installed fresh nuxt3 and following the steps of nuxt shadcn/vue , when I add button

`

`

I get this error when I reload the page.

[vite-node] [plugin:vite:vue] [VITE_ERROR] /components/ui/button/Button.vue <br><pre>&lt;script setup lang="ts"&gt; import type { HTMLAttributes } from 'vue' import { Primitive, type PrimitiveProps } from 'radix-vue' import { type ButtonVariants, buttonVariants } from '.' import { cn } from '@/lib/utils' interface Props extends PrimitiveProps { variant?: ButtonVariants['variant'] size?: ButtonVariants['size'] class?: HTMLAttributes['class'] } const props = withDefaults(defineProps&lt;Props&gt;(), { as: 'button', }) &lt;/script&gt; &lt;template&gt; &lt;Primitive :as="as" :as-child="asChild" :class="cn(buttonVariants({ variant, size }), props.class)" &gt; &lt;slot /&gt; &lt;/Primitive&gt; &lt;/template&gt; </pre><br>

Also when I open the file components/ui/button/index.ts the 'class-variance-authority is showing a red highlight

import { type VariantProps, cva } from 'class-variance-authority'

Vue: Cannot find module 'class-variance-authority' or its corresponding type declarations.

Here is my nuxt.config.ts

export default defineNuxtConfig({
  compatibilityDate: '2024-04-03',
  devtools: { enabled: false },

  devServer: {
    port: 4000,
    host: '0.0.0.0'
  },

  modules: ["@nuxtjs/tailwindcss", "shadcn-nuxt"],
  shadcn: {
    /**
     * Prefix for all the imported component
     */
    prefix: '',
    /**
     * Directory that the component lives in.
     * @default "./components/ui"
     */
    componentDir: './components/ui'
  }
})

Thank you in advance.

[sadeghbarati]

Can you provide minimal reproduction? what packageManager are you using?

https://nuxt.new/s/v3

[ezekel]

It works now I just re-installed