How can I detect specific page in layout?
I have a marketing.vue layout that wrap all pages, this layout contains Navigation.vue component which has float menu, on some pages I need to turn off the float effect, how I can do that?
How can I generate a tag cloud from a custom Nuxt Content
Hi everyone,
I'm currently using Nuxt Content and have defined a custom schema that includes a tags field with the type
z.array(z.string())
.
On the frontend, this seems to be interpreted as a string[]
, but under the hood, it appears that the data is stored in the database as a text field with a JSON dump of the array.
...Nuxt3: Using node version below 18
Hi community!
Is it possible to use Nuxt 3 with node version below 18?
I'm trying to run nuxt app on older ubuntu version (v18). However, ubuntu does not support node version above 18 due to glibc incompatibility. I could either:...
Nuxt UI - Responsive Model/Drawer
Hey guys, how would we implement this responsive model with Nuxt UI.
https://www.shadcn-vue.com/docs/components/drawer.html...
what is the requireJs alternative?
I have a dependency called videojs that needs global/window.
however that doesn't exist and I found an issue (https://github.com/videojs/video.js/issues/5680#issuecomment-570120497) that shows a fix but it requires requirejs....
Fresh nuxt3 install weird inline styles issue
Hello,
Today I started a new nuxt3 project but I noticed that my tailwind utility classes were not applied. I did investigate and it turns out there is an inline style which is taking priority. I have absolutely no idea where it comes from. I tried to create several projects with as few modules as possible. Just nothing but
pnpm create nuxt test
and the problem occurs.
I also tried on edge where i have no extensions to see if that could be the issue but it is not...
Then I tried to set the future: { compatibilityVersion: 4}
and the problem was gone. But i'm not willing to commit to this flag for a production project.
Then i also tried ...
defineProps not auto imported?
I am new to Nuxt and Vue. I have setup a new Nuxt v3.16.1 project. Created a default.vue layout with some additional components.
However, when I try to use defineProps, I am receiving the following error message:
Cannot find name 'defineProps'.
```...
Need Help with `@nuxt/eslint` + Prettier + TypeScript Rules (Nuxt 3 + Tauri)
Hi everyone,
I'm working on a Nuxt 3 + Tauri project (initially based on the
Project Setup: ...
I'm working on a Nuxt 3 + Tauri project (initially based on the
nuxtor
template but with significant modifications). I'm trying to properly configure @nuxt/eslint with Prettier while ensuring that TypeScript rules are correctly applied, but I'm running into some issues.Project Setup: ...
@nuxt/fonts layout shift
@kapa.ai i'm seeing a layout shift when force- reloading a project that uses @nuxt/fonts and the font "inter" with ctrl+f5 on a production package.
Shouldn't @nuxt/fonts prevent this on common fonts? what could be reasons for this?...
Weird date error with callender element
```html
<template>
<div class="mt-8 ml-8">
<div class="flex flex-col w-fit">
<span class="text-white">Dates</span>...

Auth middleware not redirecting
I'm using nuxt-auth-utils and everything in my middleware works exept the redirect itself. I even get the "DUMMY REDIRECT" in the console. I've even tried with await, return, await return. abortNavigation() also does nothing. Why is that?
auth.global.ts
```js
export default defineNuxtRouteMiddleware((to, from) => {...
Explicit import from local Layer
Hi! I am migrating a Nuxt app to a layered architecture because we want to create a second application with a lot of the same core code, just some pages that are different. I migrated the folder structure to the following:
- pnpm-workspace.yaml
- package.json
- packages...
useAsyncData with pinia
I was reading through the documentation on
useAsyncData
and I noticed that it mentioned:
with the following example: ```ts const offersStore = useOffersStore()...useAsyncData
is for fetching and caching data, not triggering side effects like calling Pinia actions, as this can cause unintended behavior such as repeated executions with nullish values. If you need to trigger side effects, use thecallOnce
utility to do so.
Websocket "unknown" type in typescript app
I have this plugin, and I want to use the send functionallity on components. I also want to add others later on (subscribe to topic etc).
```javascript
import { defineNuxtPlugin } from "#app";
export default defineNuxtPlugin(() => {...

Mocking a plugin
Is it possible to mock a plugin which is imported using useNuxtApp() in a component which is being unit tested?
useFetch not updating data ref when new request is triggered.
This is my simplified version of composable
```ts
const projectCache = () => useState("projectCache", () => ref({}))
const useProject = async (projectId: Ref<string>) => {...
[Solved] Storing a user object globally
Greetings! I want to store a user object globally after parsing a JWT in a server plugin, and I seem to only get this partially right. Why am I doing this? Because where my Nuxt app is deployed, authentication happens before the web traffic reaches the Nuxt app. In the request I can see a header with the JWT that has the user info.
What I want to happen (which I accomplished easily in Flask in my previous website) is:
1. before any page loads, check if there is a user already in a context/global object. If so, continue. If not, we need to check the request header.
2. parse the JWT in the request header...
Improval of Scrol-Saver
Hello, I got this code:
```ts
export default defineNuxtPlugin((nuxtApp) => {
const router = useRouter();
...