Is there a way to compile Component.vue
files into JavaScript files for use with the Vue CDN in HTML?
For example, consider the following component Component.vue
:
<template>
<div class="demo">{{ msg }}</div>
</template>
<script>
export default {
data() {
return {
msg: "Jatin Garg",
};
},
};
</script>
<style scoped>
.demo {
color: blue;
}
</style>
Now we want to include the compiled Component.js file in the following HTML:
<html lang="en">
<head>
<script src="/path/to/Component.js"></script>
<script src="vue@next"></script>
<body>
<div id="app">
<component></component>
</div>
</body>
<script>
const app = Vue.createApp({});
app.component("component", Component);
app.mount("#app");
</script>
</head>
<body></body>
</html>
I am aware of a library called vue3-sfc-loader
that can assist with this process. However, I am interested in compiling the .vue file offline.