Skip to content

Aliases don't seem to work when defined in blueprints #160

@daniandl

Description

@daniandl

https://stackblitz.com/edit/nuxt-starter-5qj9ao?file=nuxt.config.ts

Defaults work, but components inside aliases have a Component is missing template or render function warning and don't render.
From a quick look at source code, I think it's because they don't get mapped to the components properly like the regular aliases config property.

Current hack solution

// vuetify.config.ts
...
blueprint: {
  defaults: blueprint.defaults,
},
aliases: blueprint.aliases,
...
// blueprint.ts
import type { ComponentName } from 'vuetify-nuxt-module'

export default {
  aliases: {
   MyBtn: 'VBtn',
  } as Record<string, ComponentName>,
  ...
}

Bonus tip for anyone dealing with Typescript and needing Intellisense on your virtual components:

declare module '@vue/runtime-dom' {
  export interface GlobalComponents {
    MyBtn: typeof import('vuetify/components')['VBtn']
  }
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions