javascript 预编译 mustache 模板还是从外部加载?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7284190/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 23:34:46  来源:igfitidea点击:

Precompile mustache templates or load externally?

javascriptcoffeescriptmustache

提问by Ronnie

It would be useful to have a Coffeescript include function so it could load the external mustache templates when compiling in javascript and not clutter the coffee files.

有一个 Coffeescript 包含函数会很有用,这样它就可以在用 javascript 编译时加载外部 mustache 模板,而不会使咖啡文件变得混乱。

Actually you can load .mustache files at runtime but you need to call them with an ajax request with some performance penalities involved.

实际上,您可以在运行时加载 .mustache 文件,但您需要使用 ajax 请求调用它们,并涉及一些性能惩罚。

I would like to precompile some static mustache templates and include them in generated javascript function that could be Stitchedand compressed in a single file.

我想预编译一些静态胡子模板,并将它们包含在生成的 javascript 函数中,该函数可以缝合和压缩到单个文件中。

Is there a project or a script for that?

是否有项目或脚本?

回答by kupriyanenko

I think this solution for you, javascript template precompiller for mustache and othe template engines https://github.com/kupriyanenko/jsttojs

我认为这个解决方案适合您,用于 mustache 和其他模板引擎的 javascript 模板预编译器https://github.com/kupriyanenko/jsttojs

for example, use with command line

例如,与命令行一起使用

jsttojs templates compiled/templates/index.js --ext mustache --watch

or use solution for grunt, grunt-jsttojs

或使用 grunt、grunt-jsttojs 的解决方案

回答by c-smile

First of all you can use something like this:

首先,你可以使用这样的东西:

<script type="text/x-mustache" id="tid...">
  ... mustache template ...
</script>

to include your templates in dedicated script blocks rather than as strings in code. getElementByID()+ innerHtml()will give you its source that you can use.

将您的模板包含在专用脚本块中,而不是作为代码中的字符串。 getElementByID()+innerHtml()会给你它的来源,你可以使用。

About the Mustache in general - you cannot compile it strictly speaking. Templates get interpreted each time you "instantiate" the template.

关于一般的 Mustache - 严格来说你不能编译它。每次“实例化”模板时都会解释模板。

If you do need to compile them then consider use of my Kite engine: http://code.google.com/p/kite/or any other compileable templates: http://jsperf.com/dom-vs-innerhtml-based-templating/99

如果您确实需要编译它们,请考虑使用我的 Kite 引擎:http: //code.google.com/p/kite/或任何其他可编译模板:http://jsperf.com/dom-vs-innerhtml-based -模板/99

回答by sciritai

Absolutely, this is something we do where I work. All the templates go in a single html file and get's inserted into the dom at build time. Each template is stored in a script tag of type unknown so the browser just ignores it. Then you can reference them using selectors.

当然,这是我们在我工作的地方所做的事情。所有模板都放在一个 html 文件中,并在构建时插入到 dom 中。每个模板都存储在未知类型的脚本标签中,因此浏览器会忽略它。然后您可以使用选择器引用它们。

<script type="unknown" id="id_of_template">
  <ul>
  {{#words}}
    <li>{{.}}</li>
  {{/words}}
  </ul>
</script>

render = (template) ->
  view =
    words: [ 'hello', 'there' ]
  template = $('#' + template).html()
  html = Mustache.to_html template, view

John Resig has a good article on the technique http://ejohn.org/blog/javascript-micro-templating/

John Resig 有一篇关于该技术的好文章http://ejohn.org/blog/javascript-micro-templating/

回答by Brian Reischl

I'm looking at doing something similar. I haven't tried this yet, but it seems like you could use Node.js and Mu, the Mustache build for Node.js, to do this. Pseudo-JS code...

我正在考虑做类似的事情。我还没有尝试过,但似乎您可以使用 Node.js 和Mu(Node.js的 Mustache 构建)来执行此操作。伪JS代码...

var compiledTemplate = Mu.compile("myTemplateFile.html")
fs.writeFile("myCompiledTemplate.js", compiledTemplate.toString());

回答by Marek Gregor

Twitter's library Hogan.jsdoes the job.

Twitter 的库Hogan.js 可以完成这项工作。