Shadcn-vue on Jetstream+Inertia - just getting #document-fragment

[andy-james-white]

Hi, hoping someone can help

I'm using shadcn -vue on a fresh install of laravel Jetstream+inertia

Set everything up, imported a Button component as a test, and it will not show up

Everything looks 100% fine, no errors on npm run dev/watch/build, or console.

In the Vue Dev Tool the component is shown. It has all the tailwind CSS properties expected.

Weird thing is on using FF inspect the tag is greyed out, like the style is display:none;

Hoping someone will have bumped into this before, it must be something obvious.

For details on how to recreate in less than 10 minutes see here
https://laracasts.com/discuss/channels/vue/vue-shadcn-components-fresh-install-of-jetstream-intertia

I've tried a couple of options running as SSR or regular app.js, CSS variables yes&no, still cannot get the component to show.

I'm not a regular poster to forums, but with no debugging information to go by as far as I can tell, I really need the advice of someone more experienced than me

Update: I answered No to the Typescript option

Thanks

[andy-james-white]

Oh dear. I blindly copied the "Usage" example, which included the template tag around the component.

Obviously without any conditionals or slots, it just didn't show up and of course neither did the component.

I'm going to consider this not time wasted as
a) I learnt loads about the frameworks
b) should someone else come across this IMO shadcn-vue works great with Jetstream Inertia