Module @nuxt/ui is disabled due to incompatibility issues

[quocvjnh]

Description

Hi there,

I installed the project from scratch with the below commands: For Nuxt: bun x nuxi@latest init test

For Nuxt UI: npx nuxi@latest module add ui

When I run the project with bun run dev, I got the below warning:

My package.json is as follows:

"dependencies": {
    "@nuxt/eslint": "^0.5.7",
    "@nuxt/ui": "^2.18.6",
    "@nuxtjs/tailwindcss": "^6.12.1",
    "@pinia/nuxt": "^0.5.4",
    "@vueuse/core": "^11.1.0",
    "@vueuse/nuxt": "^11.1.0",
    "nuxt": "^3.13.2",
    "vue": "latest",
    "vue-router": "latest"
  },
  "devDependencies": {
    "@nuxt/devtools": "^1.5.1",
    "ts-node": "^10.9.2",
    "typescript": "^5.6.2",
    "vue-tsc": "^2.1.6"
  }

And my config is:

modules: [
    '@nuxt/eslint',
    '@nuxtjs/tailwindcss',
    '@nuxt/ui',
    '@pinia/nuxt',
    '@vueuse/nuxt'
  ],
  vite: {
    server: {
      hmr: {
        clientPort: 3000
      }
    }
  },
  ui: {
    global: true
  }

I'm wondering why...

1. I got the Nuxt 3.8.2 warning
2. There's no auto-completion for Nuxt UI component (I installed Vue - Official extension)
3. Using Nuxt UI components gives error

[benjamincanac]

This is weird indeed, would you mind sharing a reproduction?

[quocvjnh]

This is weird indeed, would you mind sharing a reproduction?

Just a basic implementation. Please have a look at this: https://github.com/quocvjnh/nuxt-incompatibility

[ThibaultVlacich]

I see you're using bun. I've had a lot of issues with bun personally, with dependencies not being properly de-duplicated. And multiple versions of nuxt being installed by modules. Try deleting you node_modules folder and bun.lockb et redo a bun install

[quocvjnh]

@ThibaultVlacich I tried and the issue still remained. Also tried pnpm but that did not solve.