13,104 questions
0
votes
0
answers
16
views
How to use Layouts in Nuxt 3 with a single [...slug].vue dynamic page?
Simplifying my code, I have this setup:
/components
/page
Type1.vue
Type2.vue
/pages
[...slug].vue
app.vue
where in [...slug].vue I have
<template>
<PageType1 v-if="page?....
- 618
1
vote
0
answers
14
views
Nuxt 3 + Pinia: Plugin API undefined inside store
I'm building a Nuxt 3 frontend that talks to a separate backend.
I want to structure my API calls using the Repository Pattern, based on this article. I'm using vue3 composition API with typescript (...
- 119
0
votes
0
answers
20
views
How to announce page title with screen readers (NVDA) on page vavigation in Vue 3/Nuxt 3 without ARIA live regions
I'm building a Nuxt 3 application and need to ensure that the page title is announced by screen readers (e.g., NVDA) when navigating between routes for accessibility compliance. My app is a flight ...
- 73
0
votes
0
answers
19
views
vite-pwa nuxt runtime-cache offline support
I'm currently in a PoC for a project for a customer, where we're planning on implementing a cityGuide that will show POIs and other thins on a map. One of the main criterias is, that this cityGuide ...
- 1
0
votes
0
answers
40
views
Why my input validation function and mask for it are not working?
I have a problem. There is a parent component Form/index.vue , which contains an input for a phone number, it is linked to v-model. But for some reason, validating the mask using a function in the ...
0
votes
0
answers
34
views
Using hubDatabase prepare function throws server error
I am building an app using Nuxt 3 and deploying it to Nuxt Hub. I am using the provided database that comes with Nuxt Hub. Inside an api endpoint in the server folder, I runa query with the database ...
- 13
0
votes
0
answers
10
views
Sitemap doesn't work correctly with Nuxt2 and İ18n
I have a website and I use Nuxt2 and i18n. When I create a sitemap, the link structure appears as someurl.com/en/en or someurl.com/en/hakkimizda (this is a Turkish link). Also, in my own sitemap ...
0
votes
1
answer
93
views
Installing Scripts into Nuxtjs 3 + Tailwind project introducing errors
I have a Nuxtjs project using Tailwind CSS that was working locally when build with yarn dev until today when I installed Nuxt Scripts in an attempt to get YouTube embeds working per the documentation ...
- 81
1
vote
0
answers
20
views
Wildcard subdomain uses custom page folder in nuxt.js v3
i want write a nuxtjs project with wildcard subdomain,
what i want:
in domain.com/** pages folder be: pages/root/**
in [wildcard].domain.com/** pages folder be: pages/sub/**
for ex:
domain.com/contact ...
- 11
-1
votes
0
answers
29
views
useState vs ref in composables
I would like to have a Nuxt composable with a state, shared in the components that import the composable. I am not sure how I should define it, and what the differences would be:
// composables/...
- 30.2k
0
votes
1
answer
39
views
Vue (Nuxt.js) adding type to `defineModel` from `useAsyncData`
In my Nuxt.js project I have an API endpoint (GET /api/trackers/:id):
export default defineEventHandler(async (event) => {
const { user } = (await requireUserSession(event)) as unknown as { ...
- 863
0
votes
1
answer
34
views
Minor errors on the client trigger full-screen error page in Nuxt
I have a Nuxt 3 app. Each time some little error happens on the client in vue, nuxt shows an error.vue page
This may sound great and make you notice these little errors faster, but in production - ...
- 1,828
0
votes
0
answers
32
views
Excessive Refresh Token Requests in Nuxt Auth (sidebase)
Environment
bun v1.2.5
Operating System: Windows_NT
Node Version: v22.14.0
Nuxt Version: 3.16.0
CLI Version: 3.23.0
Nitro Version: 2.11.6
Package Manager: [email protected]
Builder: ...
- 11
0
votes
0
answers
27
views
Get page cookie in nuxt when navigating on client
I need my cookie on pages /city/[id], so I set it with path=/city/;. But when I start working with site from page / or refresh page / and then go to /city/1 by NuxtLink, I don't see my cookie.
I ...
0
votes
1
answer
35
views
Nuxt 3 runtimeConfig not populated from process.env in production Docker build, but process.env is available later
I'm encountering an issue where my server-side runtimeConfig in Nuxt 3 is not being populated correctly from environment variables when running the production build inside a Docker container managed ...
- 1,535
0
votes
1
answer
40
views
What is the difference between the routes and api functionality in a Nuxt server? [closed]
When building a Nuxt application, the server can provide routes and among them, the api one.
Is there a technical difference between a generic route (~/server/routes/hello → http://localhost:3000/...
- 30.2k
0
votes
1
answer
80
views
Nuxt app front end on Azure app service server issue with trailing slash. When refreshing or redirecting, adds slash and routes to old version of page
So we have this strange issue on our Nuxt 2 front end which is running on a server in Azure app service. The back end is Java spring also running on Azure app service. So what happens is that anytime ...
- 13
0
votes
1
answer
34
views
NUXT JS + REST API via CLI
For example we have low level load SaaS on PHP and we want to refresh front with NUXT or NEXT. We do not want to scale it. Just one server for PHP and NUXT/NEXT (SSR). We need data from php to js. So ...
-3
votes
0
answers
23
views
How to match in nuxt-auth-utils the cookie data with a user session on the backend?
I just started to use nuxt-auth-utils and managed to log in with Google and retrieve the user email from their profile, on the backend.
I am now going to embark into persisting the session in a ...
- 30.2k
0
votes
1
answer
44
views
Nuxt 3 + NuxtErrorBoundary: "el.hasAttribute is not a function" when rendering fallback template
I'm working on a Nuxt 3 app and trying to use <NuxtErrorBoundary> to catch errors from a child component.
Here is my setup:
components/UserCard.vue
<template>
<div>This will ...
0
votes
1
answer
45
views
What is a way of adding a favicon in Nuxt 3?
I am not sure how to add a favicon in Nuxt 3. I see many suggestions online, but they all don't seem to work.
I've now put my favicon in the /public folder as favicon.ico, I've run a new npm run dev, ...
- 1,449
-1
votes
1
answer
37
views
How create a definePageMeta transition that go deeper than 'el' element?
I've been reading up on Transitions on the Nuxt 3 documentation and on various blogs. But I cannot figure this one out. Say that I do a page transition like so:
const pageTransition = {
name: 'page-...
1
vote
1
answer
34
views
Tailwind padding settings for container
I use TailwindCSS v3 in a Nuxt project a have following settings:
postcss: {
plugins: {
tailwindcss: {
content: ['./src/**/*.{scss,vue}'],
theme: {
screens: {
xs: '...
- 465
1
vote
0
answers
50
views
Some Nuxt 3 API endpoints work and some not, same code logic for client and server
I'm making a fully AI made app, for the sake of experimenting and because I needed something fast. One feature is importing a CSV file into a sqlite database (I'm using Bun) and another is adding ...
- 356
0
votes
0
answers
60
views
nuxt3 project deployment encountered an error on nginx Error: Couldn't resolve component "default" at "/"
could you tell me what happened when Couldn't resolve component "default" at "/" and similar paths were reported on nginx? Opening locally on the server is fine, and deployment in ...
- 3
0
votes
0
answers
17
views
Nuxt SSR not working properly with PM2 in Ubuntu
Suddenly my nuxt project which running in ubuntu with nginx doesn't work propertly with SSR
Operating System: Linux
Node Version: v20.18.0
Nuxt Version: 3.15.4
CLI Version: 3.21.1
Nitro ...
- 633
-1
votes
0
answers
15
views
No LSP support for default components in Nuxt
I am new to Nuxt3, and I am trying to use components, pages, ... and it is executing and running.
But the Problem is My LSP can not find those components imported by default. I have tried to open my ...
0
votes
0
answers
36
views
Nuxt fluctuating performance , LCP
I have landingpage built in Nuxt3.16, deployed on NuxtHub. I optimized my cloudflare settings as Nuxt documentation says and also installed nuxt vitalizer module. When i make page speed tests, ...
0
votes
0
answers
53
views
Nuxt 3 - linting error when using typescript types
I keep on getting strange linting errors when trying to lint a .vue file. In the following file I get this error. I am using the antfu default linter as it was recommended by a lot of people online as ...
- 1,193
0
votes
1
answer
36
views
How can I make the tsserver language server and vue-tsc aware of my global type modifications in my index.d.ts file?
Edit: I have also tried following the vue documentation and moving the vue type modification into router.ts in my types folder but that did not resolve the issue.
I have a Nuxt 3 project using ...
- 121
0
votes
0
answers
47
views
Not all components impacted by coverage
for a Nuxt.JS project I have this coverage:
As you can see, only a few of my components are tested (green), while the rest are not impacted by any tests I run. Even components like ColorPalette or ...
0
votes
1
answer
37
views
Request credentials error in dev console (Firefox & Chrome) when loading Google Font using '@nuxt/fonts' (local dev mode)
I am loading three Google fonts from Google. I am using '@nuxt/fonts' module in Nuxt 3. In dev console for both Firefox and Chrome I get this error:
A preload for
'http://192.168.1.129:3000/_fonts/...
0
votes
0
answers
17
views
Strack trace line mismatch eventhough source maps are enabled
I am developing a Vue 3 / Nuxt 3 application with Vite, Nitro and SSR.
I have issues with understanding errors that happen on the server side when running the dev server.
For testing purposes I am ...
- 773
0
votes
0
answers
32
views
how do i implement xterm console via proxmox api in nuxt 3
currently i'm coding a nuxt 3 / vue / typescript customer panel for my server hosting company. i'm facing issues when trying to implement shell / xterm from lxc / kvm servers on the slug page in my ...
-1
votes
1
answer
43
views
How to correctly address the type behind useFetch in Nuxt?
I use the useFetch() composable in Nuxt (3.16) and VS Code signals that one of the properties I get from the call does not exist -- this is in reality a type comparison issue I do not understand.
My ...
- 30.2k
0
votes
0
answers
44
views
Nuxt 3 SPA on Azure Storage Account: 404 on Initial Load & Possible Cache Issue
Issue:
I have a Nuxt 3 application configured as a Single Page Application (SPA) (ssr: false).
Locally, everything works as expected,
but when deployed to Azure Storage Account as a static site, I'm
...
- 13
1
vote
0
answers
21
views
Can't retrieve Cookie with Local Provider in NuxtAuth
I'm having some trouble getting my cookie back when I try to login with the Local provider in NuxtAuth.
Here's my nuxt.config.ts
RuntimeConfig: {
baseURL: '/api/auth'
},
auth: {
isEnabled: ...
- 117
0
votes
0
answers
32
views
Having difficulty getting 'nuxt_graphql_client' to work out of the box with all the latest versions (Nuxt 3.16, nuxt-graphql-client 0.2.43)
I am using Nuxt@latest (3.16 at the time of this writing) and attempting to use nuxt-graphql-client@latest (0.2.43 at the time of this writing) which is supposed to work out of the box w/o any ...
- 627
0
votes
0
answers
28
views
Nuxt - Redirect client from server with sendRedirect not working
Im trying to handle unauthorized errors from an external api. When the status code 403 comes in the client should be redirected to the login page directly from the server if possible.
Im using the ...
- 316
0
votes
0
answers
17
views
Nuxt SSG - SEO for modals
My clients need SEO for modals. Yeah, and it really works with SSR. But recently they decided move to SSG because it is landing part. Is it even possible to have SEO for modals with SSG?
Lets say we ...
- 33
0
votes
0
answers
37
views
Can't start Nuxt project from scratch - Cannot read properties of undefined (reading 'some')
Can't start a Nuxt project from scratch, getting this error:
ERROR Cannot start nuxt: Cannot read properties of undefined
(reading 'some') nuxi 13:10:24
at /C:/Users/sergi/...
0
votes
1
answer
26
views
Load fallback component if main component does not exits
The MainFooter might not exist in the themes folder, in that case we are loading fallback component.
Here is what I came up with:
<template>
<component :is="footerComponent" /&...
- 862
0
votes
0
answers
48
views
Nuxt 3 with GSAP - how to properly manage global timeline
I am currently building a website using Nuxt 3 and GSAP.
I want all the animations on the homepage to be connected, so I am using a Timeline for this purpose.
The flow of animations is as follows:
An ...
- 1
1
vote
1
answer
39
views
class-transformer doesn't work. Invalid character: '@'
I'm a beginner with nuxt.
I installed 'class-transformer' in Nuxt3 application. And I created Article.ts and used it in script block like below.
import { Expose } from "class-transformer";
...
- 11
0
votes
1
answer
32
views
I am trying to use before-leave to take a specific decision when the user changes the el-tab in Nuxt / Vue
I am using Element Plus tabs to switch between different page contents. Each tab contains a form. If a user fills out a form and tries to switch tabs without saving, they should receive a warning that ...
0
votes
1
answer
28
views
How to apply nuxt server middleware to pages only?
I use nuxt server middlewares in my project. They catch every request, whenever it's a page defined in the pages directory or something else (static assets etc). I want to limit some of my middlewares ...
- 1,828
0
votes
0
answers
32
views
How to permanently override nested/transitive dependencies in npm for security fixes (Axios in @nuxtjs/axios)
I'm working on a Nuxt 2 project where I need to fix a security vulnerability in Axios v0.21.4, which is a nested dependency of @nuxtjs/axios.
I've added the following to my package.json:
"...
- 73
1
vote
0
answers
287
views
I can't use @nuxtjs/seo and @nuxtjs/robots packages in nuxt 3
I have a package problem in my nuxt.js application
As soon as I install @nuxtjs/seo, and @nuxtjs/robots packages and add them to modules, the application starts giving an error. I tried to change ...
- 19
0
votes
1
answer
67
views
Compress HTML pages in Nuxt 3 beyond static assets
I'm currently working on a Nuxt 3 project with the following configuration:
export default defineNuxtConfig({
srcDir: "src/",
devtools: { enabled: true },
ssr: true,
modules: [ ... ]...
0
votes
1
answer
31
views
How do I set a ref on the underlying img element in NuxtImg?
I am trying to set a ref on the NuxtImg as I want to pass the image along to a shader component. I have tried this but it does not work:
<NuxtImg src="/thelogo.png" ref="thelogo"...