Nuxt

N

Nuxt

Nuxt Community Chat Server

Join

How to create a markdown mailto link using a bound value containing an email address

Have no problem binding an email value, such as [email protected], through use of the :data prop for presentation in a markdown document using {{ email }}. The question is how to create a clickable mailto link using the email value. Have tried [{{ email }}](mailto:{{ email }}) ...

Can't find devtools tool for generating TypeScript types

I could've sworn there used to be a way to auto-generate typescript types for an API endpoint from Nuxt devtools. I can't find it though. Is this a feature that you need a seperate module for, can i just not find it, or was it removed?

UAuthForm autocomplete warning

UAuthForm gives autocomplete warning, is there a way to set it? It also happens on the docs autocomplete....
No description

test-utils wont register custom plugins

I'm currently migrating away from the auto imports and since the unit tests are not working anymore it seems like I need to switch to nuxt test utils (away from a custom setup with the vue test utils). But now my custom nuxt plugins are not registered anymore (useNuxtApp does not include them). I just get $myPlugin is not a function. Any ideas on how to debug this?...

Nuxt form behaving differently bettwen dev and build

I am trying to build a form in my app. Sadly it behaves differently between dev and build. In dev it just executes the onSubmit method and everything is fine. For build it redirects to the post url. This is the code: ```...

Prevent Nuxt from escaping the meta title

Does anyone know if it's possible to prevent Nuxt from escaping test when writing the title? I'm trying to add a slash, eg: testing w/ a slash and it escapes it to: <title>testing w&#x2F; a slash</title> ...

Special Chars in Query params in useFetch()

Hi everyone! My Backend expects query params for filter use case to be like: http://localhost:3000/cats?search=i&filter.age=$gte:3 The Filter name includes a special char (.) -> e.g. &filter.age=...

Popover being covered by other components.

I have a component that contains a popover and I am using a v-for loop on the component. When the components are listed out, the ones below the component you click on cover the popover. Here is the component code. ```html <script setup lang="js"> const props = defineProps({...

How to add HTTP headers to bundle assets

Hi everyone, I'm trying to create a template page for Azure ADB2C using Nuxt3. The HTML is requested by Azure and the authentication form is injected in a specific <div>. This is not working because of CORS errors as page and its static assets do not belong to the same domain as AD. I managed to add CORS headers to the HTML request, but I can't figure how to add such headers to bundle assets (CSS and JS). Nitro server handlers (maybe registered too late ?) and it hooks like beforeResponse are not called for static assets....

Nuxt nested layout

Hi everyone, We're having a problem with Nuxt and nested layouts. If there are more than one nested layout, the layout stacks. For example two headers and two sidebars, that we don't want to see please refer to the linked stackblitz. https://stackblitz.com/~/github.com/kilisei/nuxt-layout?file=package.json Please reply if you know how to fix this. Thank you for your help :)...

State Management

Can i somehow shorten this code? ```js const TVstate = () => { if (openedRoom.value.hasTV === 'unknown') { openedRoom.value.hasTV = 'Yes'...

Access InternalApi in module build

Is it possible to access the InternalApi in a module during the build process?

"Simpler" date conversion from API without using a special formatter like SuperJSON?

Does anyone know of a tool/module/whatever that could be naturally parse api responses back into their native data types? For instance, Dates get converted to string for serialization but not back on the client side. I've used SuperJSON previously to handle the conversion, but that also makes debugging less enjoyable since now all the api responses are encoded in its format which just creates a lot of noise.

Nuxt Server Api response data typing with parameters

Is there any way to get a narrowed down type when calling a GET request with parameters? For instance, If I call useFetch(`/api/user/${userId}`) it'll give me the base object and if I want to include extra data like their posts I would call useFetch(`/api/user/${userId}`, { query: { includePosts: true }) and I want that response to be typed to include the includePosts key and that it exists

eslintnuxt/nuxt-config-keys-order problem

I currently getting this error [Expected config key "extends" to come before "modules"eslintnuxt/nuxt-config-keys-order] With the configuration below... ```...

Add Route middleware in Module

How can i add route middleware as module author in Nuxt 3?

Rebuild routes.json and router.js (in the background) on target: server

Hello, I have tried multiple solutions online but none gave the right answer for our project. We have a Storefront built with Nuxt2 and would like to have a server endpoint in our Front-end which we can call from our Back-end. And then quietly rebuild Nuxt2 (or only the router) so we can use the new routes that were generated....

do .server components support style tag in Nuxt?

The style classes are not working for my .server component when I run the build. They work on locall server perfectly. Is there another way that I nedd to import these classes maybe like in useHead or something? This is the bare minimun code for my .server component ```javascript <template> <div class="hero-search">...

Set @nuxtjs/i18n options from module

I'm trying to use the latest @nuxtjs/i18n on a module and I'd like it to already set the default i18n options and locales for the project using this module. Is there a way to make it work without declaring locales again in the playground nuxt.config.ts? I created an reproduction here:...