Nuxt

N

Nuxt

Nuxt Community Chat Server

Join

Nuxt UI not rendering css correctly on build

When I run dev locally, the CSS for Nuxt UI looks fine. However, when I build the image and deploy, some of the CSS is not loaded. I don't get any error messages either. I'm using latest version of Nuxt (3.15.4) and UI (2.21.0) I've attached two images to show the toggle is only shown on local/develop but missing on build/production....
No description

Lint Error in nuxt.config

It shows things in VSCode, red underline... but the error it gives is... Expected config key "modules" to come before "devtools"eslintnuxt/nuxt-config-keys-order The issue, is that is where it is. I even figured perhaps I am blind and asked CoPilot to fix it... and CoPilot put the devtools before modules. Perhaps that is correct? No, the same message prevails....

Autoplay Video

i have a video on me homepage that should play automatically with sound when you come to the website. but because of all these security measures this doesn't work, is there any other way how i can solve this, or a plugin from nuxt itself?
No description

Nitro Plugin Question

How do I make a plugin not restart every time i save a different file? id rather it restart (every time i do npm run dev for example) and stay running with the same data

[@nuxtjs/i18n]: Couldn't find AnalyzedNuxtPageMeta by NuxtPage (/__nuxt_ui__/components/:slug)

I have installed Nuxt UI Pro 3 in my project with nuxt i18n but i have this error message : [@nuxtjs/i18n]: Couldn't find AnalyzedNuxtPageMeta by NuxtPage (/nuxt_ui/components/:slug), so no custom route for it

Nuxt Content static hosting

Hi all, I'm using Nuxt Content for my portfolio/blog website, and recently decided to move to digital ocean. I have the preset set to static, but the query to get the blogs folder does not seem to be working. It works locally when I use bun generate, but hosted it does not. No errors in the console - how can I go about debugging this? My blogs list is empty, and going directly to a blog post url does not work either....

Garbage in logs

There's too much garbage in the logs. For example, if I'm missing a prop on a component, I'm getting " WARN [Vue warn]: Missing required prop: "modal" at <StorageModal heading="Modal heading" freeText="<p>Masse fritekst i gizmo:</p><ol><li><p>fdfdf</p></li><li><p>fdfd</p></li></ol><p></p><p>fdfdf</p><ul><li><p>fdfd</p></li></ul>" modelValue=false ... >" ...

Stripe error on production

on every request at stripe i got this error but i send to stripe the api key `import Stripe from 'stripe' const config = useRuntimeConfig() ...

Nuxt Seo needs help

Hi Nuxt team, I wanted to share some feedback as a Nuxt user. The Nuxt SEO module is one of the main reasons I (and many others) chose Nuxt over vanilla Vue. It's a crucial feature for building production websites, especially when dealing with sitemaps, OG images, and other SEO requirements. I really appreciate @harlan's incredible work on the module. However, I've noticed there are quite a few open issues that could use attention. As someone who relies on this module for production sites, I believe additional resources in this area would greatly benefit the community....

Page appearing empty when navigating (but not directly)

On my website, https://nuxt.whitecoastrailway.com, clicking on News and Jobs in the navigation return pages with no actual content, only the header and footer (which itself is covered by the header). Using useAsyncData just errors with Cannot stringify a function, and the documentation for the sanity module says that useSanityQuery wraps useAsyncData, so there would seemingly be no point in this anyway. I'm using Sanity with the official module as my CMS to display news posts and job listings, and almost the same code is used is used on each index page. Here's the script in the jobs page: (bit messy but idc)...

[closed] Page appearing empty when navigating (but not directly)

On my website, https://nuxt.whitecoastrailway.com, clicking on News and Jobs in the navigation return pages with no actual content, only the header and footer (which itself is covered by the header). I'm using Sanity with the official module as my CMS to display news posts and job listings, and almost the same code is used is used on each index page. Here's the script in the jobs page: (bit messy but idc) ```ts...

Deserialize object after its fetched

Is it possible to have a convenient function that takes a SerializeObject<T> and returns its content casted as a T?

Vite alias depending on server or client script

How would one do an alias to dynamically import a library or another in Nuxt3, if the code has to be sent either to the frontend or if its worked upon in the backend?

run serverside code on startup

i want to make code run at runtime, im struggling to find out how, ive tried plugins/hooks, i've tried putting code in the base scope of a utils file, ive tried nitro plugins, not sure what else to do. i want this to start an interval and run in the background of the whole server and not be needed by any of the other scripts (besides the data that it edits offhand)

Playground with hmr for a nuxt module which contains scss

in my module, I import style with "nuxt.options.css.push(resolve('./runtime/assets/index.css'))" and also "import('../assets/optionalStyle.css')" but these files are scss files compiled, and so I have problems when I try to launch a playground to test my module with hmr because it tells me that it can't find the css files, logical since the scss files are not compiled (and I don't think I want them to be compiled at that time to have hmr on the style too), how can I solve my problem?

Pinia store with Nuxt layers

We have an issue with the Pinia store when it is used in the Nuxt layers. The error is: ```...

cant install @tanstack/vue-query?

```npm i @tanstack/vue-query :snowflake: shell npm error code ERESOLVE npm error ERESOLVE could not resolve npm error npm error While resolving: nuxt-app@undefined...

connection is not secure, even after configuring https in nuxt.config.ts

Hi, I'm relatively new to nuxt. I'm attempting to enable https in my development environment. All tutorials I've seen refer to using localhost, but I'm developing on a local server so I'm not sure what to do differently. I've updated my system hosts file so example.com (here changed to obscure my exact setup) redirects to my development server. I've generated certificates using mkcert and updated my nuxt.config.ts with the following: ``` devServer: { host: 'example.com',...

Is it possible to make a Promise globally available on every page?

I want to have access to a Promise on every page because I need to see, if the action is done yet, on other pages. I am using vue-sonner with toast.promise. The problem: I want to create a toast using a composable and the promise state should be reflected on other pages too, but it seems like the Promise is only active and resolvable on that page, where it is created. The promise is pending till I move back to the page, where it was created. Is this even possible?...