Questions tagged [nuxt.js]

Nuxt.js is a framework for creating Vue.js applications, you can choose between Universal, Static Generated or Single Page application (inspired by Next.js)

Filter by
Sorted by
Tagged with
0 votes
1 answer
12 views

VueJS/Nuxt.JS how to properly load state from localstorage using "useLocalStorage"

I am trying to use useLocalStorage from pinia, however on store's state, data is not fetched from local storage but getting the default value instead. Here is the code in my store method: import { ...
Mr. Kenneth's user avatar
0 votes
0 answers
27 views

Alert Component does not show after triggering the same Error twice

I am currently working on a Website using Nuxt.js (Vue.js) and I am having trouble with my custom Alert Component. I created a contact-form on my website that triggers a custom notification when the ...
HenrikB's user avatar
  • 121
0 votes
0 answers
6 views

Accessing rendered HTML in Nuxt hook in order to process and change the order of meta tags in nuxt2

I used the capo.js extension and my website has a critical ordering issue in metatags. how can I find a way to reorder meta tags based on capo.js suggestions in nuxt2 SSR? I tried to find a way to ...
MiladHp's user avatar
0 votes
0 answers
7 views

Event Listeners Not Working After Route Change in Nuxt3

Stack Overflow community! I'm currently working on a Nuxt3 project and facing an issue with mouseenter and mouseleave event listeners within my layout. These events work as expected on initial page ...
atom63's user avatar
  • 1
0 votes
0 answers
20 views

error when navigating via nuxt-link: Uncaught (in promise) TypeError: Cannot read properties of null (reading 'parentNode')

I encountered a problem that when I go to nuxt-link I get an error: runtime-dom.esm-bundler.js:39 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'parentNode') at parentNode (...
Павел Саенко's user avatar
0 votes
0 answers
17 views

Cannot Access Store Data after Initialization

I am developing a Nuxt 3 SPA that has a Single API call that I make in the onMounted() hook in my app.vue. I use Pinia and I have defined a function in my Pinia store and I call that function to ...
Mushood Hanif's user avatar
0 votes
0 answers
6 views

What is causing the error Cannot find name 'useSupabaseClient'. when using Nuxt 3 and Supabase?

Using npm I have installed Nuxt 3 and Supabase but in vs code I keep getting the following error; Cannot find name 'useSupabaseClient'. When I run npm run dev I get the following error message on the ...
Amy's user avatar
  • 1
-1 votes
0 answers
37 views

"nuxt.options._layers is not iterable" error. What to do ? First day with vue.js

I am totally new to vue.js and I got this error while trying to launch my first npm run dev : nuxt error : nuxt.options._layers is not iterable I can't find any help about this anywhere. What to do ?...
aa bb's user avatar
  • 433
0 votes
0 answers
7 views

useFetch to authenticate token

I have a NUXT component that just needs to authenticate a users zendesk token, would the useFetch composable the correct way to do this? I first gave this a go but looking to rewrite in the best way: ...
Pianoc's user avatar
  • 797
0 votes
0 answers
8 views

Is it possible to redefine the last nested layout instead of the first one?

This is the test repository: https://stackblitz.com/edit/nuxt-starter-dps2dp As you can see on the Level 2 / v2 page the default layout will be replaced, but I'm looking for a way to replace the level-...
Ky6uk's user avatar
  • 1,126
0 votes
1 answer
26 views

Issue with getting transitions to work on appear

Here is a reproduction link: https://stackblitz.com/edit/github-vats7o?file=pages%2Findex.vue The problem is that I want to make a transition on appear. I can't get it to work so it uses my custom ...
Reconnact's user avatar
0 votes
0 answers
43 views

Component output renders incorrectly after running Nuxt production/build

I've got a headless Nuxt 2 (2.17.1) website running in production mode (NODE_ENV=production), which renders a component imported from a package incorrectly. The problem is that the name of the ...
Maik_BEELDR's user avatar
0 votes
0 answers
11 views

Custom routes for server handlers in NuxtJS

Currently, I have set some server handlers in my server/api directory. However, due to some architecture constraints, the backend will take the same /api path. To mitigate this, I found out that I can ...
funtkungus's user avatar
0 votes
0 answers
14 views

Buefy "The client-side rendered virtual DOM tree is not matching server-rendered content" after adding password field

I am using Nuxt 2 with Buefy and FontAwesome here All I did was add a /login route with a login form asking for email and password I keep getting this error "The client-side rendered virtual DOM ...
PirateApp's user avatar
  • 5,611
0 votes
0 answers
12 views

Nuxt 2 layout/error.vue template is only rendered in development mode

When my API throws a server error (500), i am redirected to my layout/error.vue template in my development environment, but not in production, where the API call seems to be failing 'silently' in the ...
Luckytechy's user avatar
0 votes
0 answers
22 views

Nuxt3 - Route not Found

Before routing to any path it is showing but whenever my app contains some reloading, refreshing functions or even if I reload the website manually the nuxtapp is revealing 404 not found error. So I ...
Turgunov Sardor's user avatar
0 votes
0 answers
18 views

How to add a base64 image to tiptap editor?

I am using tiptap editor in vue and nuxt js and I wanted the user to upload images but the usual way is to ask them for url from the prompt and then show it or load it. I want an input tag which then ...
Dilip's user avatar
  • 67
0 votes
0 answers
21 views

Nuxt 3 App Freezes Windows on 429 Response from Server - Need Help Resolving

I'm encountering a critical issue with my Nuxt 3 application that has been causing my Windows environment to freeze whenever the server responds with a 429 status code. To elaborate, when the server ...
georiv's user avatar
  • 53
0 votes
0 answers
23 views

useFetch composable in Nux.js 3 is not working for localhost endpoint

The backend is in python which has endpoint /blogs. When called from useFetch composable with http://localhost:8991/blog. I'm getting fetch failed error, but if I use http://127.0.0.1/blogs it works ...
Prem Kumar G's user avatar
0 votes
0 answers
20 views

How can I access context's req in Nuxt3?

How can I access context's req in Nuxt3? nuxt2 asyncData({req}) { const body = req.body; } I used useRequestEvent().req.body and useNuxtApp().event.req.body. but both is undefined. nuxt3 const event =...
Yumi Park's user avatar
0 votes
1 answer
36 views

Nested useFetch cause Hydration node mismatch in Nuxt 3

Inside a Nuxt 3 page, I fetch post data by calling an action from a pinia store: <template> <div v-if="postData && postContent"> {{ postData }} {{ postContent }}...
trrrnncy's user avatar
0 votes
1 answer
29 views

How get route's params with Nuxt3

I used Nuxt3 with Composition API. When moving from bakset to order, basket is using router.push, and is turning over parameters. How can I get these parameters from order? In the nuxt2 version, you ...
Yumi Park's user avatar
1 vote
0 answers
17 views

How to use a dynamic path with Nuxt-Content?

I'm trying to display a document of a Nuxt-Content folder with a dynamic path : <script setup lang="ts"> const n = ref(1) </script> <template> <div> <...
Ferdinand's user avatar
0 votes
0 answers
27 views

Nuxt 3 project cannot locate PWA icons

DevTools Error I'm currently trying to implement PWA functionality into my nuxt 3 project but I keep getting this issue: [Vue Router warn]: No match found for location with path "/icon_512x512....
Alexander Leigh Stevanoski's user avatar
1 vote
0 answers
23 views

Missing CSS and JS Files in Nuxt.js Build

I have made some configurations in Nuxt.js, successfully removing hash values from generated files. However, after running the build, I've noticed that there are no CSS and JS files in the 'dist' ...
Michael Luo's user avatar
0 votes
0 answers
12 views

Tailwind config not properly applied with nuxt-security. Content-Security-Policy for tailwind-css

I have a nuxt project with nuxt-security and nuxt-ui, which uses tailwind-css. I have a tailwind.config.ts where I change the font-family: // tailwind.config.ts import type { Config } from '...
8ctavio's user avatar
0 votes
0 answers
21 views

Tailwind config not properly applied with nuxt-electron

I have a nuxt monorepo with the following structure: ├──📁 apps │ ├──📁 app1 │ │ ├──📁 electron │ │ ├──📄 app.vue │ │ ├──📄 nuxt.config.ts │ │ └──📄 package.json │ └──📁 shared │ ...
8ctavio's user avatar
0 votes
1 answer
17 views

How to properly check Firebase Auth with Nuxt Middleware?

I have a Nuxt app connected with Firebase. I have a composable useAuth() with the following code: import { type User, onAuthChangedListener } from 'firebase/auth'; export default function () { ...
Nishant Jalan's user avatar
0 votes
0 answers
18 views

Swiper Nuxt3 - 500 ambiguous indirect export: Pagination

I would like to create a carousel in a nuxt3 application with swiper. I have tried several ways but I always get the same error: 500 ambiguous indirect export: Pagination Here is what I tried: <...
cnihoul's user avatar
-1 votes
1 answer
41 views

Why are my images not displaying properly on my web page?

So right now I am trying to make a staff page for a website for me and a few friends. Right now I am having an issue where my images on the staff page are not being shown properly. My components ...
L4w1i3t's user avatar
  • 43
0 votes
0 answers
28 views

Nuxt 3: SEO/Meta data from API not visible when sharing link on social media

I have a blog in Nuxt 3 and each blog content along with meta data is rendered through api response. The issue is when I share the blog on social media it do not show any meta data that received in ...
Sourav Dutt's user avatar
0 votes
1 answer
50 views

Cloud Functions (2nd gen) and the "onCall" method: Why is "request.auth" undefined in SSR page?

Why am I getting a request.auth is undefined in this onCall function? I am using Firebase Function emulator for this test. I am trying to call a Firebase function directly from my app like so: /...
redshift's user avatar
  • 4,967
0 votes
1 answer
24 views

vue-select with tailwind css class for longer text the search input field goes to next line

I am using the vue-select with vee-validate within my Nuxt 3 application but the problem is that when the selected option text is too large then the <input> goes to the next line due to which ...
BATMAN_2008's user avatar
  • 2,979
0 votes
0 answers
26 views

The exception occurs when I try to use Nuxt3 to add the nitro plugin

(My English is weak, the following text is translated by Deepl) In the process of learning this framework by reading the Nuxt3 documentation, when I read the following section https://nuxt.com/docs/...
psyduck's user avatar
0 votes
0 answers
23 views

Integrating Nuxt.js for SSR in a Dockerized Stack with Python FastAPI, Elasticsearch, MongoDB, and Vue.js

I'm currently using a Docker Compose stack that includes: Traefik for SSL and proxying (all to the FastAPI). Python FastAPI for backend API and serving static files. Elasticsearch for search ...
HongWonYul's user avatar
0 votes
0 answers
21 views

How to use redirectTo during Sign In with Supabase and Nuxt?

This is the code that I use and works: const redirectTo = `${window.location.origin}${query.redirectTo}`; const { error } = await client.auth.signInWithOAuth({ provider: "google", ...
Adrian's user avatar
  • 19.7k
0 votes
0 answers
19 views

why I am getting `useCart/addItem Error: Product Type undefined not supported in add to cart yet` error in `vue storefront`?

script> import {ref} from '@nuxtjs/composition-api'; import {useProduct, useCart} from '~/composables'; import {SfImage, SfTile, SfHeading, SfPrice, SfSelect, SfAddToCart} from '@storefront-ui/vue';...
Muhammad Usman's user avatar
0 votes
0 answers
9 views

NuxtJS- static files

so I have a file named config.js inside the public folder, the reason for that location is I don't want that file to get rendered after I run "npm run generate", but after I run the command ...
Oussama Chaieb's user avatar
0 votes
0 answers
33 views

Using Nuxt Image Optimisation With Firebase Cloud storage

I employ Nuxt Image to reduce image sizes and quality. Image URLs are obtained using nuxt server routes to obtain the download urls of the images. In nuxt.config.ts, I've included the firebase storage ...
ayitinya's user avatar
  • 166
0 votes
0 answers
23 views

Nuxt 3: Nested dynamic routes not prerendering as expected

I'm working on a Nuxt 3 project with the goal of having every page prerendered at build time, except for specific dynamic routes like my shop and products pages, which should always be dynamic. I'm ...
anywhereseason's user avatar
0 votes
0 answers
13 views

How do I properly do API calls usin Nuxt 3 Generate method

As the title suggests, whenever I perform a search in production using npm run generate, I get a 404 response for the search API I have the following structure pages/search/index.vue and server/api/...
Gezzasa's user avatar
  • 1,443
0 votes
0 answers
32 views

Create Nuxt 3 UModal (Nuxt UI) dynamically

I have a table with multiple rows, like the following sample: Now I want to show modal to re-confirm the action before actually deleting. Currently I use a global variable to pass deleteModalId data ...
Gea-Suan Lin's user avatar
0 votes
0 answers
35 views

Is there a way to only download the login.vue page of a client-side application until the user authenticates?

I am developing a Nuxtjs 3.x web app. And I am wondering if it is possible to hide any sensitive front-end code from unauthenticated users. For instance, an unauthenticated user would load the website ...
sam whittle's user avatar
0 votes
0 answers
17 views

Mock Service Worker warning in Nuxt3

While playing around with Nuxt3 for the first time, after some time I observed that the console issues a following warining: [Vue Router warn]: No match found for location with path "/...
bette_davis_eyes's user avatar
0 votes
0 answers
25 views

Nuxt3 + Vuex Basic example

I'm new using Nuxt3 and I want to add some state management with vuex I have this App.vue file <template> <NuxtPage /> </template> <script> export default { mounted() {...
Jules Perez's user avatar
0 votes
0 answers
15 views

Custom serialization and deserialization with pinia in nuxt3

I am working with Nuxt3 and Pinia. I love how the majority of the SSR hastle is managed automatically for you. However, I have a custom class that makes my life a lot easier. It has some convenient ...
darkie7's user avatar
  • 21
0 votes
1 answer
22 views

How do I make a dynamic route in nuxt

I need help because I have a api route that works like this localhost:3000/api/info/${id} and I want to set it up so I can go to localhost:3000/info/${id} and it will have the data that gets returned ...
HiroBeBroke's user avatar
0 votes
1 answer
49 views

nuxt/image module in nuxt 3 causes problem in production

When using the Nuxt/Image module and building the application, the image URLs are being changed to https://domain.x/_ipx/_/images/foods/Appetizaer/Garlic-Bread.png. However, the images cannot be ...
Ali Abniki's user avatar
0 votes
1 answer
35 views

Nuxt vuetify not recognised in Nuxt.config.ts

new error for me, trying to install Nuxt vuetify Install with npm install --save-dev @invictus.codes/nuxt-vuetify npm install Then I add the module to Nuxt.config.ts export default ...
Paul 's user avatar
  • 595
0 votes
0 answers
18 views

ckeditor5 duplicated modules error in nuxt 3

I have used the ckEditor 5 "@ckeditor/ckeditor5-build-classic": "^40.2.0", in my Nuxt 3 project and I want to upload images within the editor and for that I have used plugin CKBox &...
Kishan Bhensadadiya's user avatar

1
2 3 4 5
251