Toffe Posts - Answer Overflow

Toffe

Posts Comments

NNuxt

•Created by Toffe on 4/8/2025 in #❓・help

vuetify-nuxt-module - How to define a custom theme? The "createVuetify" is nowhere to be seen.

Using nuxt3, vue3, vuetify3 stack

5 replies

NNuxt

•Created by Toffe on 4/2/2025 in #❓・help

Fetch is typed but not the object i put it in

When getting the /api/test it is typed correctly.

const res: SerializeObject<{
    findings: {
        id: string;
        title: string;
        description: string;
        createdById: string | null;
        updatedById: string | null;
        createdAt: Date;
        updatedAt: Date;
        deletedAt: Date | null;
        testId: string;
        severity: $Enums.FindingsSeverity;
    }[];
... some more..

const res: SerializeObject<{
    findings: {
        id: string;
        title: string;
        description: string;
        createdById: string | null;
        updatedById: string | null;
        createdAt: Date;
        updatedAt: Date;
        deletedAt: Date | null;
        testId: string;
        severity: $Enums.FindingsSeverity;
    }[];
... some more..

Using it below

export const useTestStore = defineStore("test", () => {
    // Store State
    const storeData = ref();

    const reset = () => {
        storeData.value = [];
    };

    const reload = async () => {
        const res = await $fetch("/api/test");

        if (!res) {
            return false;
        }

        storeData.value = res;
        return true;
    };

export const useTestStore = defineStore("test", () => {
    // Store State
    const storeData = ref();

    const reset = () => {
        storeData.value = [];
    };

    const reload = async () => {
        const res = await $fetch("/api/test");

        if (!res) {
            return false;
        }

        storeData.value = res;
        return true;
    };

But if i ever try to use storeData it complains that it is of type any, how can i get the type the fetch gives and put as type for storeData?

5 replies

NNuxt

•Created by Toffe on 3/28/2025 in #❓・help

Trying to use a Pinia store in a global middleware for auth check fails

It fails with an error:

Uncaught Error: [🍍]: "getActivePinia()" was called but there was no active Pinia. Are you trying to use a store before calling "app.use(pinia)"?

Uncaught Error: [🍍]: "getActivePinia()" was called but there was no active Pinia. Are you trying to use a store before calling "app.use(pinia)"?

So using a store in a global middleware is not possible? Or am i missing something? Code is like this in "auth.global.ts"

import { useUserStore } from "~/store/user"

const userStore = useUserStore();

export default defineNuxtRouteMiddleware((to, from) => {
    if (!userStore.isLoggedIn) {
      return navigateTo('/login')
    }
  })

import { useUserStore } from "~/store/user"

const userStore = useUserStore();

export default defineNuxtRouteMiddleware((to, from) => {
    if (!userStore.isLoggedIn) {
      return navigateTo('/login')
    }
  })

10 replies

NNuxt

•Created by Toffe on 3/27/2025 in #❓・help

Websocket "unknown" type in typescript app

14 replies

NNuxt

•Created by Toffe on 3/21/2025 in #❓・help

How to Use SSE for Real-Time Updates Across Multiple Stores in Nuxt 3 with Pinia

Hey everyone! I'm working on a Nuxt 3 project using Vue, Vuetify, and Pinia, and I’m implementing real-time updates with Server-Sent Events (SSE) as described in the Nitro WebSocket guide. I’ve successfully set up an SSE endpoint at /sse, and I can receive messages without any issues. However, I’m stuck on two points: How can I send SSE messages from other API routes (like /api/updateNote.ts) to notify changes globally? How can I subscribe to these SSE updates in a way that works across my entire app, rather than manually subscribing in each store or component? For example, I want my Pinia store for "notes" to automatically update when an SSE message arrives, regardless of the current page. Any advice or best practices would be greatly appreciated! Thanks in advance!

18 replies

Gaming

Programming