我刚刚浏览了Vue.js网站上的指南，对组件模板感觉很不好。在字符串中指定它们对我来说似乎很奇怪。当然，这可能适用于非常短的模板，但是一旦您进入多行模板，就需要开始转义新行，而将javascript字符串中的html开头就感觉不对。更不用说语法高亮或其他任何不错的IDE功能对于JS字符串中的HTML都是没有用的。
文档中详细介绍了两种选择，它们使用内联模板或X-templates，但是不建议使用这两种方法。
唯一的其他选择似乎是“ 单个文件组件”，这似乎是一个不错的选择，但是它们位于“ 高级”部分和文档中，据说对于中小型应用程序，只需使用Vue.component就足够了。此外，单个文件组件看起来更难以集成到项目中，因此需要利用项目的构建系统（文档讨论Webpack和Browserify）。
所以我很困惑。我是否只需要接受我的组件代码看起来像直接从文档中拉出来的这个例子一样混乱？
Vue.component('currency-input', {
template: '\
<span>\
$\
<input\
ref="input"\
v-bind:value="value"\
v-on:input="updateValue($event.target.value)"\
>\
</span>\
',
......
根据我的经验，如果模板很短，则使用内联模式就可以了。如果不是这样，x模板还可以使您摆脱转义的换行符。我不明白您为什么不鼓励使用这些方法。您能否提供更多信息？
但是，如果您坚持要嵌入较长的模板内联，则仍然可以进行此操作而无需转义。答案是ES6 模板文字 -包含在其中的字符串
``：另一方面，我真的认为vue-cli是一个很好的工具。Webpack是值得学习的东西。