Question

更新我想避免在客户端编译模板，并在我的本地ant构建过程中编译它们。也许类似于将jQuery和jQuery模板加载到rhino中，依次将$.template()函数传递给每个.jst文件的内容，并构建应包含的“templates.js”：

$.template['model-view'] = resultingFunction.toString();
// 1 for each .jst file

这样，我可以将每个模板保存在一个单独的文件中，并避免让所有客户端冗余地编译相同的模板。

我正在使用jQuery模板，并且希望将它们分成自己的文件（例如，model-view.jst），这些文件在构建项目时被编译成函数并在jQuery中提供.tmpl（）以后使用的范围。

例如，给定文件 model-view.jst

<li>${name}</li>

这个文件和所有其他.jst文件应该在构建时被选中，编译成一个函数，以后可以在程序中的任何地方使用，如下所示：

$.tmpl('model-view', {
    name: 'Matt'
});

Answer 1

我使用Node.js和coffeescript解决了这个问题，将部分模板化的目录放入可执行的预编译函数中。希望这会有所帮助。

https://github.com/wookiehangover/jquery-tmpl-jst

Answer 2

我让你决定你是否喜欢它。）

在你常见的js库中定义这个函数：

function loadTemplate(templateName) {
   $.ajax({
      url: templateName + '.jst',
      success: function(data) {
         $.template(templateName, data);
      }});
}

然后在您掌握hml文件<head></head>部分，您可以添加：

<script type="text/javascript">loadTemplate('model-view');</script>
<script type="text/javascript">loadTemplate('another-model-view');</script>

因此您可以在代码中的任何位置使用

$.tmpl('model-view', your-data)
$.tmpl('another-model-view', your-data)

希望有所帮助

将JavaScript模板预编译为项目构建中的函数

2 个答案: