multi file component

• index.vue contain script
• index.tpl.vue contain template
• index.style.vue contain style

index.vue

//= require_self
//= require index.tpl
//= require index.style
<script lang="coffee">
vm = {
  data: ->
    members: []
    search: ''
    page: 0
}
</script>

index.tpl.vue

<template>
  <div>
    <div class='search icon-input' v-if='search_box'>
      <span class="search-icon glyphicon glyphicon-search"></span>
      <input class="form-control" type="text" v-model='search'>
      <span @click='clear' class="clear-icon glyphicon glyphicon-remove"></span>
    </div>
    <card v-for="m in members" :m='m'></card>
    <infinite-loading :on-infinite="onInfinite"></infinite-loading>
  </div>
</template>

index.style.vue

<style lang="scss">
  @import "bootstrap-sprockets";
  @import "bootstrap/variables";
  @import "bootstrap/mixins";

  // Reset and dependencies
  @import "bootstrap/normalize";
  @import "bootstrap/glyphicons";
</style>