Nuxt

N

Nuxt

Nuxt Community Chat Server

Join

watchEffect vs effect (Hydration Error)

I recently solved a hydration error by switching from watchEffect in a pinia store to effect (from @vue/reactivity) - why are these treated differently in Nuxt? Is there a way to make sure watchEffect runs during SSR as well?

Build Issues on Apple M chips

Is anyone else experiencing issues building a Nuxt app with Vuetify on macOS (Apple Silicon, e.g., M1/M2) using Docker virtualization with rosetta? I’m building the Nuxt application inside a Docker container targeting the linux/amd64 platform. The build works perfectly and completes quickly without Vuetify. However, as soon as I add Vuetify (following the official installation instructions), the build process hangs indefinitely with no error output. It seems related to the combination of Apple Silicon and the cross-architecture container. Has anyone encountered something similar or found a workaround?...

Hot-Refresh end on white-screen

I don't understand, but it suddenly started happening. After I edit my code hot reload happens and then my screen turn white. I already checked out on git history where this didnt use to happen. I'm not sure whats happening or what I'm doing wrong....

Hydration mismatch when using text from raw file

I am trying to read out a raw text file and use it's content in a component. However this always produces a hydration text mismatch with an identical output. I am reading the files like this: ```ts import base from '~/assets/data/compose-pieces/base.yaml?raw';...
No description

Nuxt UI v3 vue only x vitest

Does anyone know the nuxt ui v3 setup for vitest (vue only installation). I am facing: ``` TypeError: Package import specifier "#imports" is not defined in package ...

Pre-transform error: Duplicate attribute.

So, i get this error while using dev server ( not tested on build ). I think i got this after adding shadcn/ui-nuxt Form component to my project.
No description

Nuxt UI 3 Dynamic Theming

Tello, It's in the name :), I would like to do like Nuxt UI 3 page: Allow the user to choose the primary color (or more) to retheme dynamically. I tried to research about it here and there, but I can't find more than chaning CSS variable, which would be a very tailwind way....
No description

is it okay to use `await useFetch()` inside my composable?

is it okay to use await useFetch() inside my composable, which is not a useFetch wrapper. i am then using my composable inside the <script setup> with await. something like this const { status, refresh, productList, totalCost } = await useMyCart()...

How to get current locale on server side using i18n module?

How to get current locale on server side using i18n module?

lucide-vue-next hydration mismatch

I'm getting hydration mismatches on my lucide-vue-next icons. Anyone know why this would happen?
No description

Strange cookie behaviour

So, quick recap: When frontend receives cookies with the response on the /auth request, they are received, but for some reason with all of the other requests they are not attached. I've attached the cookie sending code on the server. BTW, it works on chrome, but not on firefox, and at least on my PC it wouldn't work on edge....
No description

Error 'Cannot read properties of undefined (reading external)' when running bun run dev with Nuxt 3.

Hey everyone! I'm facing an issue when trying to run my Nuxt project with bun run dev. I created the project using npm create nuxt@latest -- -t ui --packageManager=bun, but when I run the dev command, I get the error below. It seems related to Nitro, but I'm not sure how to fix it. Has anyone encountered this or have any ideas on what might be causing it? Here's my environment: - Operating System: Linux - Node Version: v20.12.2 - Nuxt Version: 3.16.2...

"Missing Required Prop" when I never defined any propss

```html <template> <UForm class="w-[50%] flex flex-col gap-2"> <UFormField label="Name" class="w-full" :error="null">...
No description

Fetch is typed but not the object i put it in

When getting the /api/test it is typed correctly. ```javascript const res: SerializeObject<{ findings: {...

defineCachedEventHandler strips out headers

Anyone know why this is?
export default defineEventHandler(async (event) => {

console.log('headers', event.node.req.headers)
export default defineEventHandler(async (event) => {

console.log('headers', event.node.req.headers)
this is good ^, i get the headers, (which i need for auth, to pass on) yet changing to defineCachedEventHandler just logs out {} ?...

How to make microservice on AWS with nuxt?

I have a nuxt project consisting both frontend and backend api. using mongodb as a database. currently deployed on vercel. my friend who experienced in AWS, just join team and I want to migrate to use AWS. He offered me that we should separate the code into frontend and backend distinguishly. So we're finding the solution that does not break our code much now because we're continously implementing new feature. - How to make microservice on AWS with nuxt? - Should I go without microservice? or any consideration before moving to microservice? (I don't see the urgency for now)...

UNavigationMenu custom variants UI3

Hello Kapa 🙂 Show me how to create custom variants for UNavigationMenu in Nuxt UI3 I mostly want to change links colors (hover, activated or not) and size...

UButton custom variants with UI3

Hello dear kapa I was creating custom variants in Nuxt UI2 to choose from when creating a button, I fail to see how to do it with Nuxt UI3 Ideally, I would like to create custom colors and custom variants and mix them at will...

Nuxt content v2 -> v3

Nuxt version ^3.16.2:
```js future: { compatibilityVersion: 4 },...

Auto Imports vs. components/AppHeader.vue (?)

Hello guys, I am blocked with setting a new app due to the auto imports issue. In fact everything seems odd with Nuxt since yesterday night. Have you seen such err already?...
No description