Cue Comments - Answer Overflow

Topics

Cue

•Created by PMDL on 10/18/2023 in #❓・help

I want to instanciate incoming data using useFetch(), should I use transform or onResponse()?

IMO I’d be explicit and create an index.ts in that directory and export the necessary classes, this way you’re not only managing your classes in one place, but not having to declare them in a plugin. You’d then do a wildcard import, where all classes are now effectively a map. While it is still a declarative way of addressing your issue, it’s much more controlled so you’re not relying on hacky logic to determine what should and shouldn’t be passed to the payload handlers.

24 replies

•Created by PMDL on 10/18/2023 in #❓・help

I want to instanciate incoming data using useFetch(), should I use transform or onResponse()?

But this depends on how you're defining your classes. For example, are the classes named exports? Are there other exports within these files? Can you extract these easily?

24 replies

•Created by PMDL on 10/18/2023 in #❓・help

I want to instanciate incoming data using useFetch(), should I use transform or onResponse()?

You can do, but you'd be better off doing so with a module where you can traverse your directory and extract classes into a virtual module, and define a plugin within the module to execute the above logic.

24 replies

•Created by PMDL on 10/18/2023 in #❓・help

I want to instanciate incoming data using useFetch(), should I use transform or onResponse()?

What's the issue you're experiencing?

24 replies

•Created by PMDL on 10/18/2023 in #❓・help

I want to instanciate incoming data using useFetch(), should I use transform or onResponse()?

That's expected since you need to explicitly define reducers/revivers.

24 replies

•Created by PMDL on 10/18/2023 in #❓・help

I want to instanciate incoming data using useFetch(), should I use transform or onResponse()?

Perhaps define a payload class map and loop? For example:

import { instanceToPlain, plainToInstance } from 'class-transformer'

const payloadClassMap = {
  NewsModel,
  UserModel,
  CharacteristicModel
}

export default definePayloadPlugin(() => {
  for (const [name, model] of Object.entries(payloadClassMap)) {
    definePayloadReducer(name, data => data instanceof model && instanceToPlain(data))
    definePayloadReviver(name, data => plainToInstance(model, data))
  }
})

import { instanceToPlain, plainToInstance } from 'class-transformer'

const payloadClassMap = {
  NewsModel,
  UserModel,
  CharacteristicModel
}

export default definePayloadPlugin(() => {
  for (const [name, model] of Object.entries(payloadClassMap)) {
    definePayloadReducer(name, data => data instanceof model && instanceToPlain(data))
    definePayloadReviver(name, data => plainToInstance(model, data))
  }
})

24 replies

•Created by phipham on 3/4/2025 in #❓・help

End-to-end typesafe for API not working in nuxt 4

@phipham In v4, ~ points to <workspace>/app and ~~ points to <workspace>...

// server/api/user.get.ts
- import { User } from '~/types'
+ import type { User } from '~~/types'

// server/api/user.get.ts
- import { User } from '~/types'
+ import type { User } from '~~/types'

5 replies

•Created by sinewy on 2/26/2025 in #❓・help

eslint and antfu config

If you’re using the module ensure you’ve added this to your nuxt config:

eslint: {
  config: {
    standalone: false // <---
  }
}

eslint: {
  config: {
    standalone: false // <---
  }
}

10 replies

•Created by negative on 2/25/2025 in #❓・help

Dark mode with neutral color seems to be broken in the UI docs

Create and report the issue here https://github.com/nuxt/ui/issues

6 replies

•Created by svecs132 on 2/24/2025 in #❓・help

Nuxt prepare error

Try npx nuxi@latest init

9 replies

•Created by svecs132 on 2/24/2025 in #❓・help

Nuxt prepare error

Nuxt 1.4.5? How’s that possible then 😂

9 replies

•Created by Moritz Walter on 11/4/2024 in #❓・help

Import composables from an other Module

Use a plugin. Add it through the module.

21 replies

•Created by Moritz Walter on 11/4/2024 in #❓・help

Import composables from an other Module

Why are you trying to access a composable in a module?

21 replies

•Created by dmarr on 2/7/2025 in #❓・help

Breaking app when awaiting composable in page setup

In short, do not await useFetch or useAsyncData anywhere besides the permitted locations.

14 replies

•Created by dmarr on 2/7/2025 in #❓・help

Breaking app when awaiting composable in page setup

The issue arising here is that you’re wrapping useFetch in a promise, and awaiting that promise, when it is expected that the promise returned from useFetch is to be resolved in setup/plugins/middleware.

14 replies

•Created by dmarr on 2/7/2025 in #❓・help

Breaking app when awaiting composable in page setup

@dmarr The warning in the docs stipulates: “do not await useFetch in a composable, as that can cause unexpected behavior”

14 replies

•Created by Gus on 7/3/2024 in #❓・help

How to handle 404 from the `_nuxt` folder?

Check your cache headers, or consider setting them, particularly via routeRules. For me, I usually cache nuxt dependencies for a day, public assets for a year (these are versioned anyway), so on. YMMV depending on how frequently you deploy. Work around your deployment schedule.

3 replies

•Created by Razane on 1/31/2025 in #❓・help

Custom pagination in Swiper in Nuxtjs

No problem ☺️

14 replies

•Created by Razane on 1/31/2025 in #❓・help

Custom pagination in Swiper in Nuxtjs

@Razane please don’t tag everyone

14 replies