Search code examples
javascripthtmlvue.jsvuejs2tags

Avoid Vue warn when using custom tags

I'm getting an error when I'm trying to use custom tags like this:

<material-button>Ok</material-button>

It's not a real component, just semantic HTML with a specific CSS. However, I'm getting this Vuew error:

 [Vue warn]: Unknown custom element: <material-button> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

Can I avoid this error without having to create and register <material-button> as a component?

Note: everything works perfectly is just that [Vue warn] that pops up in the console all the time.

Solution

  • You can use v-pre attribute on your component

    <material-button v-pre> </material-button>

    https://v2.vuejs.org/v2/api/#v-pre

    or you can use ignoredElements

    Vue.config.ignoredElements = [
    "material-button"
]

    https://v2.vuejs.org/v2/api/#ignoredElements