3👍
Placing Vue components "anywhere into html" and them magically working has never been possible.
What gives you this impression is a combination of two factors:
- Vue templates look very similar to HTML
- when a Vue app is mounted into an existing HTML element, its contents are used as template for that app.
Technically, there’s an alternative to the above: it’s also possible to register Vue components as Custom Elements. That use-case might also give you the false impression that Vue components work anywhere. But you’d still need to load Vue upfront, load and declare the web components before any browser could make sense of them.
Overall, using vue components as web components is more technically challenging than using them in a Vue app’s template.
Getting back to your example, for it to work, src/assets/js/main.js would need to load Vue and contain code to mount a Vue app into #app. Also, that Vue app would need to have a <cover-hero-carousel /> registered component.
All of the above is still possible in Vue 3, just like in Vue 2. It’s the code in main.js that needs some minor tweaking.