html.erb

<div id="<%= vue_component_kebab_name %>">
  <%= vue_component_snippet %>
</div>


<%= stylesheet_pack_tag_snippet %>
<%= javascript_pack_tag_snippet %>

javascript.erb

// This is javscript code, which uses ERB tags for templating
// All the methods will be invoked and their values will be interpolated
import Vue from 'vue/dist/vue.esm';

import <%= js_file_name %> from 'views/<%= name %>';

new Vue({
    el: '#<%= vue_component_kebab_name %>',
    components: {
        '<%= vue_component_kebab_name %>': <%= js_file_name %>
    }
});

vue.erb

<template>
</template>

<script>
  export default {
  }
</script>

<style scoped>
</style>