Display cached data while refreshing in the background
I have a hook to fetch the same data on various pages that looks like this
```ts
function getCachedData(key: string) {
return useNuxtApp().payload.data[key];...
Make Nitro build a specific package for browser runtime
I am trying to use
@aws-sdk/client-s3 in Cloudflare workers but when the SDK instantiates S3Client it tries to load the configuration from multiple including file system which is not supported and throws fs.readFile is not implemented yet!
So after a lot of digging I've came across its package.json and it had these fields
```json...What is globalThis.process.getBuiltinModule
When i get any kind of error from any of my custom nuxt modules I get this error instead of the actual error
```
ERROR Fetch handler error: globalThis.process.getBuiltinModule is not a function 12:01:05 PM
at get _request [as _request] (node_modules/srvx/dist/adapters/node.mjs:156:61)...
404 middleware
Is it possible to create some server side middleware for handling 404 errors? I have a website I migrated from an old app and I want to 301 redirect some urls that are currently a 404
generate warning
when i build using generate, it shows WARN 11:28:58 PM
(!) Some chunks are larger than 500 kB after minification. Consider:
- Using dynamic import() to code-split the application
- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit....
server API endpoint 404 Not found
Given a basic contact page inside ./app/pages/contact.vue calling a submit event handler like this
```ts
// using the Nuxt UI form
async function onSubmit(event: FormSubmitEvent<Contact>) {...
Cannot read properties of undefined (reading 'createElement') when call message.error
i just want to call
antdesign-vue message.error when api returns error.
code here:
```js
import { message} from 'ant-design-vue'
...ERROR ENOTDIR: not a directory, stat nuxt-og-image/dist/runtime/mock/proxy-cjs.js/index.js
I started getting this error since today when building cloudflare-pages version of my nuxt 4 application.
I tried rolling back to an already released version of my app but it end's up with the same error.
Happens on npm and pnpm, also tried removing node modules, clearing npm cache etc but with no result....
files in public/ 404 Not Found
i put all the images in side public/images and ust <NuxtImg> to render the images. when using build, the image path is correct which is something like /images/user.png. but it become /ipx//images/user.png when using generate and caused 404 Not Found.
Tree shaking issue with Nuxt UI (Reka)
Hi. I'm currently building an app with nuxt ui for components, and I'm experiencing this issue:
https://github.com/nuxt/ui/issues/3376
Development is still in it's early stage (app will grow exponentially) and DX is already unbearable.
I've tried basically every suggestion in the conversation, nothing works. It seems the only solution is to wait for for vite to be on rolldown. ...
500 Error: Too Much Recursion
500 Error: Too Much Recursion
useHead nuxt/dist/head/runtime/composables.js:20:10
...
How to debug hydration mismatch warning in production that don't exist in dev/preview
I've been working with other frameworks for a while and decided to put my hands in Nuxt for the first time.
For now I just a built a simple app with authentication flow and when I deployed to production, after visiting the home page I get the "Hydration completed but contains mismatches." warning in production. However, when in dev mode or in preview, I don't get anything. TBH this is a big red flag for me, I've never experienced any issues in other frameworks that would allow something so trivial to happen in production and not in development. How could I debug this?
Since it's still a small app, I reviewed all implementation and I'm using all SSR friendly (useFetch, useSTate etc)...
Nitro useStorage: delivering Brotli encoded JSON data fails in local development
I have a Nuxt 4 server route that should deliver a 400kb Brotli encoded JSON object. The json file is delivered over a custom server api route, because I need to set some custom headers for cache management with etags and set the correct content-type header.
My API route works perfectly on production (Vercel) but fails in production mode.
It seems like the browser decoding fails for some reason (maybe corrupted Brolti data sent to the browser?).
I already successfully decompressed my brotli encoded file using
brotli -d file.json.br...Profiling a Nuxt app
Hello,
I have a Nuxt app with a fairly large volume of data. I would like to know how to profile it so that I can focus optimization efforts.
Thanks in advance...
Help needed! I'm writing a blog post comparing nine frameworks
I posted this in the general channel, but I though I should post here too:
Last month I wrote a blog post "React Won by Default", and I am now writing a follow up post.
In the new post, I've built a kanban app in nine frameworks for comparison purposes. One of the apps is built with Nuxt. I did the best I could, but I'm not an experienced Vue/Nuxt dev. I'm hoping someone will be willing to review my Nuxt code to make sure I'm using Nuxt/Vue conventions and optimizations correctly. ...
Nuxt Content page very slow even with .select() or queryCollectionNavigation()
Hey,
I’m using Nuxt Content and have around 26 large markdown files (about 4 MB each).
On my homepage, I only need a few fields like
id, word, path.
...Nuxt page loads with blank page
I have a Nuxt.js SSR fullstack web application where one of the dynamic pages usually loads correctly (about 99% of the time), but very occasionally, it just shows a blank screen. If I refresh the page, it loads fine afterward.
I’m trying to understand what might be causing this rare issue and what steps could be taken to resolve it.
Thank you in advance for your help!...
Nuxt/fonts Local
Hi @kapa.ai I need to know how can add custom local fonts that ara on the public folder in a fonts folder. (public/fonts). The are two families and differents weights
How can i infer optional query params
I am infering the return type of an nitro endpoint with ...
InternalApi:
type ApiServer = InternalApi['/api/servers/:uuid']['get'];
type ApiServer = InternalApi['/api/servers/:uuid']['get'];
Nuxt UI Table row height
I am new to Nuxt and Nuxt UI so I may well be missing something in the documentation, but how can I adjust the row height of the Table component?