Image Rendering Low Resolution
This is probably a very easy fix but I don't know what to do.
I'm using Nuxt 4.1.1
Having an issue with Image Rendering in which my images are loading in lower quality for some users (even if SVG) - images are also lower quality zoomed out than zoomed in...
404 path not found in unit test
I am testing a pinia store with persistedStatePlugin in Nuxt env and tests are running green, but I get always this error:
Vitest caught 1 unhandled error during the test run.
This might cause false positive tests. Resolve unhandled errors to make sure your tests are not affected....
Nuxt Paid Consulting
Hi all. I sent an email to
support@nuxt.com to check on some paid consulting related to Nuxt. I work for a big enterprise and we're migrating some large older Vue apps over to Nuxt and we're hoping to chat about any patterns that work well, landmines to avoid, etc. Is this something the Nuxt core team supports? If not that's okay and I'll quit trying, but I also thought perhaps there is another way of reaching out that is better because it's not technically support we're hoping to buy.Help with Nuxt UI component customization
Hey everyone! 👋
I am new to Nuxt/Nuxt UI ecosystem and I am trying to understand the basics. I am struggling to understand how the Nuxt UI props/slots system works. For example, I am trying to modify a
UNavigationMenu component. I can't understand from the docs what are the props to modify:
- Active menu item background color...nuxt-auth-utils not finding env variables
Hi, I'm trying to get nuxt-auth-utils running with nuxt 4.2.0 and nuxt-auth-utils 0.5.25 using keycloak as oauth provider. I provided the
NUXT_OAUTH_KEYCLOAK_CLIENT_ID, NUXT_OAUTH_KEYCLOAK_SERVER_URL and NUXT_OAUTH_KEYCLOAK_REALMvariables in my .env file, also set runtimeConfig with
```
oauth: {
keycloak: {
clientId: "myclient",...nuxt build error: path referenced under virtual:nuxt namespace can be too long (ENAMETOOLONG)
When building (using e.g. ...
npx nuxt build) a Nuxt 4.2 app for deployment to an AWS Lambda environment, there are certain files that are referenced that cannot be opened because of an ENAMETOOLONG error which breaks the build process:
[error] [nuxi] Nuxt Build Error: [commonjs--resolver] ENAMETOOLONG: name too long, open '/codebuild/output/src5555555555/src/codestar-connections.awsregion.amazonaws.com/git-http/5555555555555/eu-west-2/101d57b9-2404-4be8-bd35-e386c67af5b6/orgname/reponame/virtual:nuxt:%2Fcodebuild%2Foutput%2Fsrc1203689123%2Fsrc%2Fcodestar-connections.awsregion.amazonaws.com%2Fgit-http%5555555555555%2Feu-west-2%2F101d57b9-2404-4be8-bd35-e386c67af5b6%orgname%2Freponame%2Fnode_modules%2F.cache%2Fnuxt%2F.nuxt%2Ffetch.mjs/package.json'
[error] [nuxi] Nuxt Build Error: [commonjs--resolver] ENAMETOOLONG: name too long, open '/codebuild/output/src5555555555/src/codestar-connections.awsregion.amazonaws.com/git-http/5555555555555/eu-west-2/101d57b9-2404-4be8-bd35-e386c67af5b6/orgname/reponame/virtual:nuxt:%2Fcodebuild%2Foutput%2Fsrc1203689123%2Fsrc%2Fcodestar-connections.awsregion.amazonaws.com%2Fgit-http%5555555555555%2Feu-west-2%2F101d57b9-2404-4be8-bd35-e386c67af5b6%orgname%2Freponame%2Fnode_modules%2F.cache%2Fnuxt%2F.nuxt%2Ffetch.mjs/package.json'
Make UseFetch Options konfigurable
I want to provide some way to let users of my plugin to configure useFetch options. I want that users can set things like getCachedData. It should be possible via the nuxt config, but I think I can't define functions and complicated stuff here that get's passed down to the actuall plugin place or can I?
how to change the code example in a docs page?
I am trying to change an example here:
Specifically line 226:
:component-example{name="tabs-model-value-example"}
Can't find a file with the same name....Good place to add a `constants.ts` file or constant variables used throughout the Nuxt 4 instance?
I need a good place to add in consant variables that aren't
env related. Any suggestions would be great!404 and redirects with netlify?
I'm struggling with my redirects instead resolving as 404s
I want to 404 except for known redirects.
I have a static site, any ideas?...
Include drizzle migrations in bundle
HI i want to have a migrator that runs on startup inside nitro context with drizzleorm migrate function it expects a path to migration dir what is the best way to include the sql migration folder as is inside the bundle so i do not need to change the path inside the nitroPlugin
ive looked at nito serverAssets but those bundle into flat .mjs files
```ts
import type { BetterSQLite3Database } from 'drizzle-orm/better-sqlite3/driver'...
On creating Breadcrumbs
Let's say, we have a route structure like this:
```js
// home
definePageMeta({...
useSetI18nParams
Hi @kapa.ai if I had this definet in my setup:
await slugsStore.loadSearch({type: 'family', locale: local.value.language, slug: slug});
let nuxtI18n = cloneObject(slugsStore.slugs);
...
Compressing response from /server/api in Nuxt 4.2.0
In Nuxt 3 I previously used
gzipSync from node:zlib to conditionally compress the responses for certain endpoints, but after upgrading it'll result in ERR_CONTENT_DECODING_FAILED on the client.
The content definitely looks like it's gzipped and the header is set.
Does anyone successfully compress responses from the /server/api endpoints in Nuxt 4?...Hi, I tried to install nuxt-security with the new nuxt 4, but I got a warning.
I got a waning "It seems that security is not a Nuxt module.", should I still install it ? any suggestion guy ?
How to pass the httpOnly session cookie received in a client api call to server nitro $fetch ?
I have nuxt-auth module that calls /me, /login endpoint from the client--which uses the session cookie correctly. And for rest of the requests I am using nuxt server directory because I quite like the idea. I have a Nuxt 4 server API endpoint (/server/api/admin/users/index.get.ts) that needs to make an external API call using $fetch. The external API requires session cookies for authentication.
Problem: When a client makes a request to my Nuxt API endpoint server, the httpOnly session cookies from that request are not automatically forwarded to the external API call made with nitro $fetch.
I m currently trying this but this doesn't work. My theory is the session cookie is not being forwarded from the client to the server. My app is in spa mode. So whats the correct approach here? Any help would be highly appreciated....
nuxt scss
500
Cannot find module '/scss/app.scss' imported from 'virtual:nuxt:C%3A%2FUsers%2Fzhaol%2FProjects%2Fbluevyfrontend-william%2F.nuxt%2Fcss.mjs'
Customize this page
Cannot find module '/scss/app.scss' imported from 'virtual:nuxt:C%3A%2FUsers%2Fzhaol%2FProjects%2Fbluevyfrontend-william%2F.nuxt%2Fcss.mjs' at ViteNodeRunner._fetchModule (C:/Users/zhaol/Projects/bluevyfrontend-william/nodemodules/.pnpm/vite-node@3.2.4@types+node_439163a0bc051d25d2296e3ba322d99e/node_modules/vite-node/dist/client.mjs:247:19) at process.processTicksAndRejections (node:internal/process/task_queues:105:5) at async ViteNodeRunner.directRequest (C:/Users/zhaol/Projects/bluevyfrontend-william/nodemodules/.pnpm/vite-node@3.2.4@types+node_439163a0bc051d25d2296e3ba322d99e/node_modules/vite-node/dist/client.mjs:268:44) at async ViteNodeRunner.cachedRequest (C:/Users/zhaol/Projects/bluevyfrontend-william/nodemodules/.pnpm/vite-node@3.2.4@types+node_439163a0bc051d25d2296e3ba322d99e/node_modules/vite-node/dist/client.mjs:189:11) at async ViteNodeRunner.dependencyRequest (C:/Users/zhaol/Projects/bluevyfrontend-william/nodemodules/.pnpm/vite-node@3.2.4@types+node_439163a0bc051d25d2296e3ba322d99e/node_modules/vite-node/dist/client.mjs:239:10) at async C:/Users/zhaol/Projects/bluevyfrontend-william/virtual:nuxt:C%3A%2FUsers%2Fzhaol%2FProjects%2Fbluevyfrontend-william%2F.nuxt%2Fcss.mjs:3:31) at async ViteNodeRunner.runModule (C:/Users/zhaol/Projects/bluevyfrontend-william/nodemodules/.pnpm/vite-node@3.2.4@types+node_439163a0bc051d25d2296e3ba322d99e/node_modules/vite-node/dist/client.mjs:397:4) at async ViteNodeRunner.directRequest (C:/Users/zhaol/Projects/bluevyfrontend-william/nodemodules/.pnpm/vite-node@3.2.4@types+node_439163a0bc051d25d2296e3ba322d99e/node_modules/vite-node/dist/client.mjs:375:3) at async ViteNodeRunner.cachedRequest...
How to use KeepAlive properly
I have a couple pages that need to be kept alive. Even though I figured it out, I still wonder if thats the way it is supposed to be.
I have the following pages overview/invoices.vue ( name prop = Overview-Invoices) and overview/items.vue ( name prop = Overview-Items).
...
[kapa.ai] i18n/nuxtjs. Issues with differentDomains
./nuxt.config.ts:
```
i18n: {
defaultLocale: 'en',
locales: [...