Search code examples
laravelsvelte

Laravel10, Interia, svelte setting shows warning


I'm new to svelte and Interia. I've setup an application with Laravel10,Interia and svelte.

app.ts goes like

import { createInertiaApp } from "@inertiajs/svelte";

createInertiaApp({
    resolve: (name) => {
        const pages = import.meta.glob("./components/pages/**/*.svelte", {
            eager: true,
        });

        return pages[`./components/pages/${name}.svelte`];
    },

    setup({ el, App, props }) {
        console.log(el, App, props)
        new App({ target: el, props });
    },
});

the application is working well. But it shows several warnings in console. Is it ignorable?

14:47:08.566 <App> was created with unknown prop 'initialPage' @inertiajs_svelte.js:6629:15
14:47:08.566 <App> was created with unknown prop 'resolveComponent' @inertiajs_svelte.js:6629:15
14:47:08.566 <Index> received an unexpected slot "default". index.mjs:2380:20
14:47:08.566 <Index> was created with unknown prop 'errors' Index.svelte:79:92

warnings in browser console


Solution

  • Svelte 4.x or lower

    Community write about a similar issue in the sveltejs/svelte #4652. The warnings only appear in the development environment, aiding the developer's work, but if confident, they can ignore the console suggestions. However, in the production code, none of these warnings will appear.

    Svelte 5.x

    From Svelte 5.x onwards, they have fixed similar prop-not-found errors.