如何在vue js中导入外部模板？

Question

我是vs js的初学者，不确定我是否要求正确。

我想为我的Laravel 5.3 - Vue Js App制作以下类型的结构。

1. MY-vue.js

    Vue.component('my-component', {
           template: 'template from Catgory.Vue'
    })
   
    new Vue({
       el: '#example'
    })
   

2. Category.vue

   <template>
       <div>
           // some code goes here
       </div>
   </template>
   

3. index.blade.php

   <div id="example">
      <my-component></my-component>
   </div> 
   

   如何在Vue.component的模板属性中使用Category.vue中的模板？或建议我更好的方法。

Answer 1

此link可能很有用

 Vue.component('my-component', {
   template: require('./Category.html')
 });
 new Vue({
     el: '#example'
 })

Category.html.js

module.exports = `<div>Hello, {{ name }}!</div>`;