Question

我认为这个问题会给我一些更多的背景：

Using pre-compiled templates with Handlebars.js (jQuery Mobile environment)

基本上我正在尝试学习预编译的东西，所以我可以节省加载时间并保持我的html文档整洁。我还没有开始，但基于上面的链接，每个模板都需要拥有自己的文件。是不是会有很多链接加载？如果我不需要，我不想发出多个HTTP请求。

因此，如果有人可以提供一些亮点，或许可以提供一个替代方案，我可以从我的HTML中获取模板，但不必加载100个不同的模板文件。

Answer 1

像Grunt.js这样的工具允许您拥有模板并使用它们。例如，此文件编译模板，然后将它们连接成一个文件：

module.exports = function(grunt) {
  grunt.loadNpmTasks("grunt-contrib-handlebars");

  // Project configuration.
  grunt.initConfig({
    // Project metadata, used by the <banner> directive.
    meta: {},

    handlebars: {
      dist: {
        options: {
          namespace: "JST",
          wrapped: "true"
        },
        files: {
          "templates.js": [
            "./fileA.tmpl",
            "./fileB.tmpl"
          ]
        }
      }
    }
  });

  // Default task.
  grunt.registerTask("default", "handlebars");
};

由于我刚开始使用预编译的模板，我还没有解决的问题是工作流程。我希望能够在运行部署版本的应用程序时编译模板，但在进行开发和调试时，我更愿意将原始单个文件保存为未编译形式，以便我可以编辑它们并重新加载页面。

跟进：

我想了解一下如何在可用的情况下获得预先编译的模板，并使用可以在人们进行开发和调试工作时即时编辑的单个模板，并希望有快速的编辑 - 重载测试周期而无需进行Grunt构建。

我想出的答案是检查是否存在JST []数据结构，然后进一步测试并查看该结构中是否存在特定的预编译模板。如果是，则无需进一步。如果它不存在那么加载模板（我们使用RequireJS来做）并编译并放入相同的JST []数组，其名称与加载预编译模板时的名称相同。

这样当实际使用模板时，代码只能在一个地方查找它，它总是一样的。

在不久的将来，我认为我们可能会有RequireJS插件来执行测试和加载/编译代码，同时保持开发人员的简单。

使用Handlebars .js（多个HTTP请求）的多个预编译模板？

1 个答案: