如何以非Javascript方式组织Vue JS？ 如何组织Vue JS项目[文件和目录]：非Javascript方式？

来自非javascript背景，我发现Vue.js非常直观且易于使用。我以前在Javascript方面的经验是在浏览器上使用JQuery和香草Javascript

我使用Vue、Vue组件和Vue路由器创建了一个应用程序。一切正常

我的问题是，我最终在项目的一个index.html文件中编写了大量代码。这个文件包含10多个模板，我已经创建并附加到我的应用程序中的不同组件。我想知道是否有一种非javascript的方法可以将这些模板组织在单独的文件中

我看到有使用webpack和browserify模块化项目的选项。但来自非javascript背景，我觉得它们并不直观。我不想走node-npm的路，因为它有自己的学习曲线，而且它在我的项目中下载了十几个我不理解的文件和依赖项。我是一个老派的人，下载文件并将其包含在网页中会更舒服

所以你可能知道我要去哪里。我需要一个解决方案，我可以把我的模板作为单独的文件，并读取这些文件在不同的组件

我所尝试的：

• 在我的组件中声明模板。但是在组件中编写所有html并不是那么干净。这也使得我的JS文件太大了。我更擅长将所有数据放在index.html中
• 将模板存储为较小的块“homepage.html”、“about.html”并存储在my components中，使用$.get/$.load读取组件就绪功能中的不同组件。这是可行的，但我仍然需要为每个组件发出一个额外的ajax调用，这是没有效率的

请不要建议明显的节点npm[网页包装和浏览]方式。我知道这是Vue支持的，但这需要一个学习曲线和完整的设置。对这个问题的回答实际上会帮助其他在节点npm方面犹豫不决的开发人员

---

如果您需要对问题进行更多澄清，请大声回答。

您提到的选项是您唯一真正的选项。。。模板的HTML需要在需要时可用，因此您必须立即将其放在HTML文件中，或者使用AJAX或类似RequireJS的浏览器内加载程序（以及允许加载HTML的扩展）加载它

---

文件内模板对于非常小的项目很有意义。随着项目的发展，您需要开始使用为此而构建的工具。NPM rocks和您需要的每一个JS包都可以在几秒钟内包含在您的项目中。

我强烈建议您尝试

它使用node、npm、webpack并下载数十个文件。您明确要求不要使用，因此让我澄清：

Vue CLI会处理复杂性问题，并为您配置网页包。
你甚至不必知道它正在使用webpack

它对开发人员非常友好（甚至有一个浏览器），与配置webpack配置相比，它降低了进入门槛

---

我希望你也会发现它“直观且易于使用”。

没错。。我明白学习node npm和webpack的基础知识似乎是有道理的。但这是我的能力范围之外的方式+学习曲线、安装和依赖性将花费我永远的时间来完成我的应用程序。因此，我不想跳进另一个选项的海洋，我想知道是否有一些老派的方法可以做到这一点。我不想强迫你这么做，但当我从“传统”方法过渡时，我laracasts.com确实帮了大忙。