Nuxt

N

Nuxt

Nuxt Community Chat Server

Join

Uncaught Error: Disallowed operation called within global scope.

When deploying my Nuxt App to Cloudflare Workers I am starting to get this error: Uncaught Error: Disallowed operation called within global scope. Asynchronous I/O (ex: fetch() or connect()), setting a timeout, and generating random values are not allowed within global scope. To fix this error, perform this operation within a handler. https://developers.cloudflare.com/workers/runtime-apis/handlers/ Also get the error when doing a production preview on local machine....

Page blanking after briefly showing data

Hi all, I've got what feels like something strange happening. When I render data on a page with a single div all work fine, however if I try and add a nested div the data content on the page shows on the page very briefly (maybe 1 or 2 seconds) before showing only the basic text title on the page. At this stage, there is no root template content in app.vue except the default...

cannot start dev server

Only URLs with a scheme in: file, data, and node are supported by the default ESM loader. On Windows, absolute paths must be valid file:// URLs. Received protocol 'c:'

401 Server error, no errors

Hi, My nuxt application simply throws a 401 error when built in production mode: '401...

Session with Redis backend

Hi. I'm trying Nuxt to replace our current stack. And I having problems trying to find a solution to save session on Redis. We need to run multiple instances and have a centralized backend for sessions. I could not find a way to add a custom backend for nuxt-auth-utils....

User Session Data Not Available in layout on login

I am having an issue where upon login, my session data isn't being loaded into the layout (where I want to show the user name etc). I am trying to use an authStore to accomplish this ```ts //src/stores/authStore.ts import { authClient, useSession } from "~/lib/auth-client";...

@nuxtjs/color-mode@4.0.0 causing issues

I recently updgraded nuxt and color-mode module in my shared layer. Now, when I try to run my app that extends the layer, things are not working. It's a tough one to explain, but I get an error when I try to run a test for example:
[nuxt] error caught during app initialization TypeError: Cannot read properties of undefined (reading 'preference')
at /Users/david.marr/src/my-nuxt-app/node_modules/@nuxtjs/color-mode/dist/runtime/plugin.client.js:19:24
[nuxt] error caught during app initialization TypeError: Cannot read properties of undefined (reading 'preference')
at /Users/david.marr/src/my-nuxt-app/node_modules/@nuxtjs/color-mode/dist/runtime/plugin.client.js:19:24
...

Repository pattern + useAsyncData + Pinia store, hydration + caching problems?

We follow this article to write all our API calls https://medium.com/@luizzappa/nuxt-3-repository-pattern-organising-and-managing-your-calls-to-apis-with-typescript-acd563a4e046 so we can fetch a resource like so const { data: documents } = await $api.users.getUploadedDocuments(); but we actually populate the reactive state in a pinia store, persisted in Cookie, const documentList = ref<DocumentMetadata[]>([]);, we use this documentList ref in our components. However we notice random cached requests, random network requests and sometimes double hydration from certain requests too, what to do?...

Custom useAuthFetch - Not getting types as useFetch

```js import type { UseFetchOptions } from "nuxt/app"; import { useUserStore } from "@/store/user"; export async function useAPI<T>(...
No description

Configuring nitro storage with environment variables

I would like to move the configuration of a GitHub-backed nitro storage to environment variables. Do I simply use process.env in nuxt.config or is there a better way?

Nuxt UI: How to Link Typography & Spacing Scales?

Using Nuxt UI Figma kit + building design system. Problem: Typography and spacing scales aren't linked, so spacing looks off when font sizes change. Example:...

create my own starter template

I am trying to find some documentation as to how I can create my own starter template. I have tried creating a github repo with a project folder setup. when I call npx nuxi@latest init -t github:my-public-github/template-repo my-app-instance...

Content from separate repo

Using nuxt 3, how would I build a site where content (including images) is stored in a separate repo?

Soft 404 issue on Google Search Console (live test url)

Hello! I’m trying to get the public card deck pages on our Nuxt 4 site (https://ilove.cards) indexed. Google keeps reporting a soft 404 on all public deck URLs. For example:...

i18n: fallback instead of 404

We use Nuxt 3 with the i18n module. Most pages have 10 locales, but the homepage should only “support” 5 (de, en, es, it, fr). What we want: - URLs like /nl/... (and other non-supported prefixes) should not 404. - The homepage should still be reachable under all 10 prefixes, but render English content when the prefix isn’t one of the 5 supported ones....

Failed to resolve icon

[Vue warn]: Failed to resolve component: Icon
[Vue warn]: Failed to resolve component: Icon
i have nuxt icon module but it says this...

I cannot set module to preserve

Argument for '--module' option must be: 'none', 'commonjs', 'amd', 'system', 'umd', 'es6', 'es2015', 'es2020', 'es2022', 'esnext', 'node16', 'nodenext'.
Argument for '--module' option must be: 'none', 'commonjs', 'amd', 'system', 'umd', 'es6', 'es2015', 'es2020', 'es2022', 'esnext', 'node16', 'nodenext'.
...

In Nuxt 4, is it possible to handle fallback during SSR like in Next.js?

It seems that the Vue Suspense component does not support SSR, so fallback rendering works only on the client side. In Nuxt 4, when using useFetch(), it waits for the response to complete before returning the fully rendered HTML… Is there any way to handle this differently?

Nuxt UI responsive defaultVariants

Hi! Is there a supported way to change Nuxt UI’s defaultVariants (e.g., set size="xl" on mobile but size="lg" on desktop) based on breakpoints? I know I can override defaultVariants globally in app.config.ts, but that applies everywhere. Does anyone have an example on making those defaults responsive without manually passing size on every component. Thanks!

how to change cursor on all clickable elements

Hello, I dont like how nuxt ui has normal cursor on clickable elements like fo example buttons, I wish to set cursor: pointer; to every clickable element. How can I do it? Thank you.