Level 15
correction, the chrome dev messages are not errors but rather warnings.
Oct 18, 2023
8
Level 15
Inertia gives a strange warnings in Chrome dev tools.
I have installed Inertia, Vite and Svelte into Laravel 10. I followed Laracasts Jeffrey Way's Inertia tutorial and everything appears to be working ie I make a change and it is reflected through into my Web Browser. "Welcome" is my first component in the Pages directory. Svelte is installed in the same way as Vue or React, just with a different plugin, so if you are a Vue / react user, your advice with be valued! I am getting these errors in my Chrome dev tools:
<App> was created with unknown prop 'initialPage'
<App> was created with unknown prop 'resolveComponent'
<Welcome> received an unexpected slot "default"
<Welcome> was created with unknown prop 'errors'
I have double checked by installation and all seems well. I have searched my project code and the 'initialPage' and the 'resolveComponent' reference is coming out of :
createInertiaApp.js node_modules@inertiajs/svete/src
Any ideas how to solve this? Many Thanks!
Level 1
I can confirm, these warnings appear when following the documentation of Inertia.
I'm new to Svelte myself so I don't know if those warnings can safely be ignored or need to be addressed. However, I did find a way to remove the two warnings in the Welcome component by adding:
<script>
export let errors;
</script>
and in the HTML markup:
<slot></slot>
The first two warnings related to the App component seem to be an issue with Inertia - I didn't find a way to get rid of them.
If anyone can please give more insights it would be greatly appreciated.
1 like
Level 15
@sebastianfeistl Thank you for that! It definitely cleared the first two warnings! I hate it when there is abug in software! I contacted Johnathan directly, he is the cerated of Inertia. Fingers crossed!
Level 15
In my opinion it is a tremendous shame when a software publisher does not respond to a bug request. I love Svelte + Inertia and would really like to use it. However, if I can not get the combination to function without warnings I start to see why people lean towards Vue. Vue has a vast array of resources and an endless community of helpers. It is high on the priority list for 3rd party developers to support their code when integrating into Vue. Less so perhaps with Svelte which is a fraction of the Vue community. So ... I think I will have to maybe use Vue 3. Bummer, perhaps, but, that's life I guess. Cheers!
Level 75
@vincej this is one of the main reasons I went with fetch js and plain JavaScript, plus nothing extra to install.
Even vue has changed so much from version 1 to version 3.
Just my opinion but I like sticking with things that are more backwards compatible over several years and not just a few months, or maybe just one year.
And also just my opinion, some of these modern JS Frameworks seem to change too often all the time.
Level 15
@jlrdw Yes, I understand your point. I have a friend who is an old Cobol programmer and still working, who says the exact same thing as you.
Level 1
Just a quick update for those interested in exploring the Inertia + Svelte tech stack, based on my extended experience with it:
The warnings are indeed safe to ignore.
While you might encounter persistent warnings about unknown props during development, they don't seem to carry over to production builds. So, if you come across these warnings while setting up your project, know that they shouldn't cause any problems once your app is deployed. Happy coding!
Level 15
@sebastianfeistl Thanks for that. Just curious - why have you selected Svelte over view? I have looked at both, and yes, the Svelte syntax is really easy to use, but the resources around Vue eg docs, and community are superior. Still have not committed either way. Up to my ears in JS. Ugh.
Please or to participate in this conversation.