2

目前我有我的 main.jade 文件,它在 Node.js 上使用 Express.js 提供。在玉文件的头部,我有我所有的模板。正如您可能理解的那样,这很快变得不守规矩。我使用以下方法从 Backbone.js 加载模板:

template:_.template($("#phone-tmplt-taskRow").html())

我的应用程序将有三个版本:移动版、平板电脑和桌面版。我想知道组织模板的最佳方式应该是什么。我不想在我的 html 文件的头部列出大约 30 个模板。我应该如何组织我的模板?我希望以某种方式拥有 3 个文件,每个版本一个。我不想根据版本提供与 node.js/express.js 不同的 URL。

4

4 回答 4

4

您可以将文件(例如 phone-tpl.html)中的模板分开,并将它们全部放在 /templates 目录中。然后你可以通过 AJAX 加载它们中的每一个,在这种情况下,我建议你有一个缓存(在内存或 localStorage 中)以最小化请求数。

另一种选择是使用 RequireJS。Addy Osmani 建议使用文本!加载模板的插件。Alex Sexton 提出了一个更复杂的选项,您不将模板加载为文本,而是预编译为 Javascript 函数(并且当使用 r.js 优化时,所有模板都被捆绑在一起,因此在生产中所有模板都是函数,您不需要向服务器请求它们)。

链接:

于 2012-07-13T15:05:48.777 回答
1

我最终将 Jade 模板用于一切——服务器端和客户端。没有下划线模板。我使用了http://projects.jga.me/clientjade/,它采用玉模板并将它们预编译成一个 js 文件。好处:

  1. 您的 html 文件中没有模板。更小、更合理的标记
  2. 预编译的玉模板速度极快
  3. Jade 文件仍然可以用来渲染 html
  4. 单一模板系统

clientjade 不监视文件更改。所以我做了一个蛋糕任务来处理这个问题。如果你走那条路,请查看我的蛋糕任务 - https://gist.github.com/4041281

于 2012-11-08T20:20:18.407 回答
0

您可以将它们放入 js 文件并使用 requirejs 加载它们。这会产生非常可读的代码并减少 dom 依赖。

于 2012-07-13T09:27:47.370 回答
-1

实际上,我最终使用了jam.js 的“包含”功能来做我需要的事情。我的应用程序的每个版本都有三个 .jade 文件,我将所有这些文件都包含在我的 main.jade 中。我假设将来我最终会在我的项目中使用 require.js,所以谢谢你的提示,eabait。

于 2012-07-13T22:59:12.100 回答