Creating the component with the <template> structure

In order to use the <template> structure in our example, we will be using the template property of the Vue object where we can pass a string or a template string as the value, which will be interpolated by the Vue script and rendered on the screen:

1. Using the base example from the 'Creating the base file' section, create a new file named template.html and open it.
2. In the empty <script> HTML element, create the constants defineComponent and createApp by object-destructuring the Vue global constant:

const {
  defineComponent,
  createApp,
} = Vue;

3. Create a constant named component, defined as the defineComponent method, passing a JavaScript object as an argument with three properties: data, methods, and template:

const component = defineComponent({
 data: () => ({}),
 methods: {},
 template: ``
});

4. In the data property, define it as a singleton function, returning a JavaScript object, with a property named...