vuejs的组件中该如何引用一个html模板而不是片段?

Question

var list = Vue.extend({
        template: '<p>我要在这里放很多html</p>'
    })

如上，在list组件中，我要加载一个列表，如果按照如上这种方式们需要拼接很多html标签，如何像angularjs那样，新建一个list.html文件，将标签在里面写好，然后通过templateUrl的方式加载list.html?

Answer 1

html:

<script type="text/template" id="tpl">
--
</script>

js:

var MyComponent = Vue.extend({
    template: '#tpl'
});

Answer 2

vue推荐的做法是将样式，script和模板写在一块，保存为.vue结尾的组件，通过webpack和vue-loader进行处理

Answer 3

建议使用vue-loader，html作为组件加载。

Answer 4

可以结合webpack用其他loader实现。
另外 Why Vue.js doesn't support templateURL

Answer 5

template 后面可以写一个id选择器，例如 '#tmpl'

在前面写一个script 标签，text/x-tpml 类型，里面放模版。

Answer 6

import template from '../template/list.html'

let list = Vue.extend({
        template: template 
})

webpack 赛高