Pre-transform error in UApp

[rotsee]

Environment

• Operating System: Linux
• Node Version: v22.11.0
• Nuxt Version: 3.16.0
• CLI Version: 3.22.5
• Nitro Version: 2.11.5
• Package Manager: [email protected]
• Builder: -
• User Config: modules, css, compatibilityDate, future, routeRules, devtools
• Runtime Modules: @nuxt/[email protected], @nuxt/[email protected]
• Build Modules: -

Is this bug related to Nuxt or Vue?

Nuxt

Version

v3.0.0 and v3.0.1

Description

After upgrading to NuxtUI 3 as per https://ui.nuxt.com/getting-started/migration, I get the following error message when running either npx run dev, npx run build or npx run generate, that seems to come from UApp(?):

I have tried removing node_modules/* and package-lock.json and make a clean install. Didn't change anything.

 ERROR  Pre-transform error: [@vue/compiler-sfc] Failed to resolve extends base type.          10:10:44 PM
If this previously worked in 3.2, you can instruct the compiler to ignore this extend by adding /* @vue-ignore */ before it, for example:

interface Props extends /* @vue-ignore */ Base {}

Note: both in 3.2 or with the ignore, the properties in the base type are treated as fallthrough attrs at runtime.

<~>/node_modules/@nuxt/ui/dist/runtime/components/App.vue
22 |  import { ConfigProvider, TooltipProvider, useForwardProps } from 'reka-ui'
23 |  import { reactivePick } from '@vueuse/core'
24 |  import { localeContextInjectionKey } from '../composables/useLocale'
   |                                         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
25 |  import UToaster from './Toaster.vue'
   |  ^^^^^^^^^^^^^^^^^^^^^^^
26 |  import UOverlayProvider from './OverlayProvider.vue'

Additional context

Full package.json

{
  "name": "test",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "dependencies": {
    "@nuxt/ui": "3.0.1",
    "nuxt": "3.16.1"
  }
}

nuxt.config.ts:

export default defineNuxtConfig({
  modules: [ '@nuxt/ui' ],
  css: [ '~/assets/css/main.css' ],
  compatibilityDate: '2025-03-19',
})

Logs

[noopurphalak]

Any update on this? getting the same error even after starting the fresh project.

[benjamincanac]

As always a reproduction is required, we cannot help you otherwise. You could have the wrong version in your lockfile, using an old nuxt or vue version, etc. I cannot know.

[rotsee]

I have managed to narrow this bug down a bit. It happens on both new and migrated projects, if there is a non-ascii(?) character in the path! At the very least an å or ö in the path triggers this error (could be in the name of the current folder, or higher up)

[benjamincanac]

Did you try to install typescript as dev dependency?

[benjamincanac]

I've tried the most minimal app with both npm and pnpm without being able to reproduce. I won't be able to do anything more without a reproduction as mentioned above.

[noopurphalak]

Did you try to install typescript as dev dependency?

Wouldn't it work with a javascript based vue project?

[benjamincanac]

No typescript is required to use @nuxt/ui

[noopurphalak]

No typescript is required to use @nuxt/ui

Is there any plan to make it work with Javascript based Vue or Nuxt projects?

[benjamincanac]

Not really no, this doesn't mean you have to use lang="ts" in your project, you can just use JavaScript.

Did it fix your issue?

[noopurphalak]

Not really no, this doesn't mean you have to use lang="ts" in your project, you can just use JavaScript.

Did it fix your issue?

Okay, got it. Yes, thanks