'Does Vue 3 support HTML-based single file components without compilation?

I've been using HTML-based components with Vue 2 - and loading them dynamically, without a compile step. That is, files that look like this:

<style scoped>
</style>
<template>
  <div>empty component</div>
</template>
<script>
module.exports = {
    data: function () {
        return {
        };
    },
    async mounted(){
    },
    destroyed: function(){
    },
    methods: {
    },
    components: {
    },
}
</script>

and are served statically.

Does this approach still work with Vue 3?



Solution 1:[1]

https://medium.com/@marcel.leusch/use-vue-3-single-file-components-without-compilation-ac2ccb5f15c2

You need to use the vue3 single file component loader

Solution 2:[2]

Yes.

Vue 3 Setup without Build Tools is the official guide on how to use Vue 3 without build tools. Hope it helps.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Alvin Wang
Solution 2 cSharp