A
A
adam_carraway2022-03-08 23:57:26
Vue.js
adam_carraway, 2022-03-08 23:57:26

How to specify in Inertiajs to ignore a custom tag?

I understand with inertiajs. When using icons, I get a bunch of warnings in the console.

[Vue warn]: Failed to resolve component: ion-icon
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.

I tried to specify that this tag should be ignored, but it does not work. Here is how I tried to do it.
VueApp.config.compilerOptions.isCustomElement = tag => tag.startsWith('ion-')
createInertiaApp({
    resolve: async name => {
        let page = (await import(`./Pages/${name}`)).default;

        if (page.layout === undefined) {
            page.layout = Layout;
        }

        return page;
    },
    setup({el, App, props, plugin}) {
        const VueApp = createApp({render: () => h(App, props)});

        VueApp.config.compilerOptions.isCustomElement = tag => tag.startsWith('ion-')

        return VueApp.use(plugin)
            .use(VueTextareaAutosize)
            .use(ElementPlus)
            .use(VueClipboard)
            .use(moment)
            .component('Link', Link)
            .component('Head', Head)
            .mount(el);
    },

    title: title => `My app - ${title}`,
})


Tell me how to do it right, before I used Vue.config.ignoredElements = [/^ion-/] .

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question