javascript - Why am I able to import Vue template into an EJS file?

Question

I was working on an Express app that uses Vue.js from a CDN and EJS as the templating engine. I create some Vuejs 'components' and import them into my EJS templates as partials. I don't know how it works but it does, I am curious as to why or how it actually works. I'm not using any bundler or anything. I wonder if there are any performance drawbacks also. thanks.

the batches.ejs

<div id="vue-home">
  <main class="container">
        <batches-component
          v-bind:batches="<%= batches %>"
        ></batches-component>
  </main>
</div>

<!-- Importing Batches component as partial -->
<%- include('components/batches.vue') %>

This is batches.vue

<template type="x-template" id="batches-component">
  <div>
    <div id="if-batches" v-if="batches.length > 0">
        batches work!
     </div>
  </div>
</template>

question from:https://stackoverflow.com/questions/65599714/why-am-i-able-to-import-vue-template-into-an-ejs-file

Answer 1

Waitting for answers