useId modules error

[Fiyuva]

Discussed in https://github.com/nuxt/nuxt/discussions/28835

^{Originally posted by **Fiyuva** September 4, 2024} Hello, I get this error when I try to build after the latest update. ERROR Nuxt Build Error: node_modules/nuxt/dist/app/composables/id.js (1:9): "useId" is not exported by "node_modules/vue/dist/vue.runtime.esm-bundler.js", imported by "node_modules/nuxt/dist/app/composables/id.js". in dev mode it says Uncaught (in promise) SyntaxError: The requested module '/_nuxt/node_modules/vue/dist/vue.runtime.esm-bundler.js?v=66f24f9d' does not provide an export named 'useId' (at id.js:1:10) `{ "type": "module", "private": true, "scripts": { "build": "nuxt build", "dev": "nuxt dev", "generate": "nuxt generate", "preview": "nuxt preview", "postinstall": "nuxt prepare" }, "devDependencies": { "@fortawesome/fontawesome-svg-core": "^6.6.0", "@fortawesome/free-brands-svg-icons": "^6.6.0", "@fortawesome/free-regular-svg-icons": "^6.6.0", "@fortawesome/free-solid-svg-icons": "^6.6.0", "@fortawesome/vue-fontawesome": "^3.0.8", "@nuxtjs/color-mode": "^3.4.4", "@nuxtjs/i18n": "^8.5.1", "@types/bootstrap": "^5.2.10", "@vite-pwa/nuxt": "^0.10.4", "bootstrap": "^5.3.3", "eslint": "^9.9.1", "eslint-plugin-security-node": "^1.1.4", "nuxt": "^3.13.1", "nuxt-aos": "^1.2.5", "sweetalert2": "^11.6.13", "typescript": "^5.5.4", "vue-tsc": "^2.1.4" }, "dependencies": { "@pinia/nuxt": "^0.5.4", "@types/crypto-js": "^4.2.2", "crypto-js": "^4.2.0", "eslint-plugin-anti-trojan-source": "^1.1.1", "flag-icons": "^7.2.3", "nuxt-purgecss": "^2.0.0", "pinia": "^2.2.2", "sass": "^1.78.0", "vue-recaptcha": "^3.0.0-alpha.6" }, "resolutions": { "@nuxt/kit": "3.0.0-rc.13" }, "overrides": { "vue": "latest" } } `

[danielroe]

Make sure you have the latest version of Vue in your project (check your lock file). latest is often not updated by package managers.

Also, why have you pinned Nuxt kit at a pre-v3 version?!

[github-actions[bot]]

Would you be able to provide a reproduction? 🙏

More info

### Why do I need to provide a reproduction? Reproductions make it possible for us to triage and fix issues quickly with a relatively small team. It helps us discover the source of the problem, and also can reveal assumptions you or we might be making. ### What will happen? If you've provided a reproduction, we'll remove the label and try to reproduce the issue. If we can, we'll mark it as a bug and prioritize it based on its severity and how many people we think it might affect. If `needs reproduction` labeled issues don't receive any substantial activity (e.g., new comments featuring a reproduction link), we'll close them. That's not because we don't care! At any point, feel free to comment with a reproduction and we'll reopen it. ### How can I create a reproduction? We have a couple of templates for starting with a minimal reproduction: 👉 https://stackblitz.com/github/nuxt/starter/tree/v3-stackblitz 👉 https://codesandbox.io/s/github/nuxt/starter/v3-codesandbox A public GitHub repository is also perfect. 👌 Please ensure that the reproduction is as **minimal** as possible. See more details [in our guide](https://nuxt.com/docs/community/reporting-bugs/#create-a-minimal-reproduction). You might also find these other articles interesting and/or helpful: - [The Importance of Reproductions](https://antfu.me/posts/why-reproductions-are-required) - [How to Generate a Minimal, Complete, and Verifiable Example](https://stackoverflow.com/help/minimal-reproducible-example)

[leosin]

Uncaught SyntaxError: The requested module '/_nuxt/node_modules/.pnpm/vue@3.4.37_typescript@5.5.4/node_modules/vue/dist/vue.runtime.esm-bundler.js?v=b0613c4f' does not provide an export named 'useId' (at id.js?v=b0613c4f:1:10)

when i update to 3.13.1 from 3.12.4...got this error, downgrade to 3.13.0 it work fine

• Operating System: Darwin
• Node Version: v20.16.0
• Nuxt Version: 3.13.1
• CLI Version: 3.13.1
• Nitro Version: 2.9.7
• Package Manager: pnpm@9.8.0

[danielroe]

You have Vue 3.4. Please upgrade to Vue 3.5 and you will be good to go.

[m3hari]

I hit this upgrading from 3.11.0 to 3.11.1; the latest vue requirement is understandable. The only surprise is a patch version introduces an issue.

[m3hari]

It's not quite the same stack trace, but it's very similar; it could help debug.

'TypeError: __vite_ssr_import_2__.useId is not a function\n    
at callWithErrorHandling (/project/node_modules/.pnpm/@vue+runtime-core@3.4.27/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:195:19)\n    
at setupStatefulComponent (/project/node_modules/.pnpm/@vue+runtime-core@3.4.27/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:7572:25)\n   
at setupComponent (/project/node_modules/.pnpm/@vue+runtime-core@3.4.27/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:7533:36)\n    
at renderComponentVNode (/project/node_modules/.pnpm/@vue+server-renderer@3.4.27_vue@3.4.27/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:623:15)\n    
at renderVNode (/project/node_modules/.pnpm/@vue+server-renderer@3.4.27_vue@3.4.27/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:755:14)\n   
at renderVNodeChildren (/project/node_modules/.pnpm/@vue+server-renderer@3.4.27_vue@3.4.27/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:771:5)\n    
at renderVNode (/project/node_modules/.pnpm/@vue+server-renderer@3.4.27_vue@3.4.27/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:743:7)\n    
at renderVNodeChildren (/project/node_modules/.pnpm/@vue+server-renderer@3.4.27_vue@3.4.27/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:771

[AnthonyRuelle]

Make sure you have the latest version of Vue in your project (check your lock file). latest is often not updated by package managers.

Also, why have you pinned Nuxt kit at a pre-v3 version?!

Hello,

I have the same problem as described above.

The overrides of vue latest is necessary for people using npm and using pinia...

(https://pinia.vuejs.org/ssr/nuxt.html#Installation)

[AnthonyRuelle]

This solution worked for me:

Remove package_lock and folder node_modules Reinstall your dependencies

(Works leaving with overrides vue :) )

[danielroe]

Closing as this is not a Nuxt bug per se, but caused by your package manager installing an old version of Vue even though Nuxt depends on a newer one.

[Fiyuva]

This solution worked for me:

Remove package_lock and folder node_modules Reinstall your dependencies

(Works leaving with overrides vue :) )

it worked for me! Thank you

[Fiyuva]

Make sure you have the latest version of Vue in your project (check your lock file). latest is often not updated by package managers.

Also, why have you pinned Nuxt kit at a pre-v3 version?!

The last time I updated it, it was in this version.

[agracia-foticos]

remove package.lock and node_modules not work for me

https://github.com/tailwindlabs/headlessui/issues/3463

[agracia-foticos]

and put "overrides": { "nuxt": { "vue": "latest" } } in package.json neither. Vue version 3.5.3 and nuxt version 3.13.1

[fnacarellidev]

Upgrading Vue to 3.5 solved for me, thank you @danielroe :)

[snakysnake]

I have the same issue... Can someone help me fix it please? I looked in package.json and I don't even have "vue" in my project. Only nuxt.

node_modules/nuxt/dist/app/composables/id.js (1:9): "useId" is not exported by "node_modules/vue/dist/vue.runtime.esm-bundler.js", imported by "node_modules/nuxt/dist/app/composables/id.js

I have no idea how to fix it, please help me.

[danielroe]

@snakysnake Ensure you have the latest version of Vue. You can run npm i vue.

[snakysnake]

@snakysnake Ensure you have the latest version of Vue. You can run npm i vue.

I see that I have some conflict when trying to npm i vue@latest. I try fixing it by running npm i --legacy-peer-deps. Let's see what happens...

• Edit: I was just afk on my project for a month and now everything is broken. What the hell.... If you think about switching from your language to JavaScript, maybe think again....

[makerovski]

This solution worked for me:

Remove package_lock and folder node_modules Reinstall your dependencies

(Works leaving with overrides vue :) )

Worked for me! How could I forget it

[dariuspilapil-swaydev]

I was able to fix this by deleting node_modules and package-lock.json, making the following updates to package.json, then reinstalling:

• change nuxt dep to "^3.13.1"
• change vue dep to "^3.5"
• add "overrides": { "nuxt": { "vue": "^3.5" } }