Vue single file components

Introduction#

Describe how to create single file components in a .vue file.

Specially the design decisions that can be made.

Sample .vue component file

<template>
  <div class="nice">Component {{title}}</div>
</template>

<script>
export default {
    data() {
        return {
            title: "awesome!"
        };
    }
}
</script>

<style>
.nice {
    background-color: red;
    font-size: 48px;
}
</style>