Jade模板在Meteor中的应用

Question

在 Meteor 的常见问题解答中 http://meteor.com/faq/how-do-i-package-a-new-templating-system 介绍了如何添加不同于默认的 Handlebars 模板引擎。在文档其他地方也有提到，Jade 是仅有的另一个明确的例子。

那么是否已经有人在开发 Jade 的相关工作呢？如果没有，我是否可以开始着手开发？还是说现在为时过早？例如：

包 API 正在快速变化，文档尚未完善，因此您目前无法制作自己的软件包。即将推出。

尽管我一直在尝试使用 Handlebars 在我的 Ember.js 项目中，但对我而言，没有什么比 Jade 更优雅。

- Jed

---

在我撰写这篇文章的时候，这个问题仍未得到解答（虽然有Debergalis的回答，但缺少一些细节）。 - om-nom-nom

这个链接 https://github.com/denysonique/Meteor-jade-handlebars 可以让你在Jade中简单地编写HTML/Handlebars。 - denysonique

Blade 是一种类似于 Jade 的模板语言，完全支持 Meteor 集成，尽管它还不是 Meteor 核心的一部分。如果你正在寻找 Handlebars 的替代方案，可以考虑一下它。- https://github.com/bminer/node-blade

• https://github.com/bminer/node-blade#meteor-support
• https://github.com/bminer/node-blade/wiki/Using-Blade-with-Meteor

- BMiner

Answer 1

我们很希望能够看到Jade的集成。 使用packages/handlebars作为模板。

基本策略是将模板引擎的输出连接到Meteor.ui.render中，这就是我们实现实时页面更新的方式。 只要您的模板返回HTML，那么它就能工作。 每次Jade模板引用Meteor.Collection文档或Session变量时，Meteor都会注册该依赖项，以便在数据更改时重新渲染模板。

更好的是，还要使用Meteor.ui.chunk和Meteor.ui.listChunk。 这些将限制Meteor在更改时必须执行的重新计算量。 例如，如果您正在使用Handlebars语言中的{{#each}}呈现文档列表，则当新文档进入结果集时没有理由重新计算整个模板。 我们只需为新文档渲染一个HTML块，并将其直接插入DOM中。 这就是listChunk的作用。

因此，您可能会发现，在Jade中仅检查if/unless和for/each就可以让您大获成功。

请注意，包开发并没有像系统的其他部分那样得到详细记录。 因此，在您进行开发时，不要犹豫向我们提出更具体的问题。

- debergalis

---

非常感谢！我的Javascript知识只有那么深，但我应该至少能够有一个良好的开端。我会回来问问题的... - Jed

请保持联系。我想尝试使用Meteor，但我还不确定如何与Jade集成。Jade让我无法编写普通的HTML。我总是忘记结束标签。 :) - BMiner

此外，其他对此感兴趣的人可以查看 Blade。Blade 是一种类似 Jade 的语言，可在 Meteor 0.3.6 中使用。https://github.com/bminer/node-blade - BMiner

Answer 2

流星 >= 0.8.0

使用mquandalle:jade包已经被官方推荐。

流星 <= 0.7.2

如果您不使用CoffeeScript，您应该查看jade-handlebars。截至本文撰写时，存在一个问题，即CoffeeScript模板文件似乎需要包装在Meteor.startup函数中，这对我造成了其他问题。

如果您正在使用CoffeeScript，您应该查看我的Cakefile。详细信息都在描述中，但简短的版本是它会自动添加/删除/更新html文件与您的jade文件一起。最终我将*.html添加到我的.gitignore中，这仅适用于不在同一项目中混合使用html和jade的情况。这有点像一个hack，但目前对我来说工作得很好。

- David Weldon

---

我想使用jade-handlebars，但不想用coffeescript，这个问题有被跟踪吗？ - Patrick Lee Scott

最接近的问题是#9。 - David Weldon

在这个链接中（https://dev59.com/bGYq5IYBdhLWcg3wjBQM），当预生成.html文件时，是如何工作的？ - Jonathan R.

我的印象是你只需要预先生成它，以便在HTML中使用常规的handlebars（我正在Mac上使用CodeKit为slim这样做）。 - Kevin

Answer 3

我刚在Atmosphere上发布了我的第一个Meteor智能包！

使用Jade+Handlebars取代HTML+Handlebars

https://atmosphere.meteor.com/package/jade-handlebars

- SimonDegraeve

Answer 4

我刚刚在我的Meteor项目中成功使用了Jade模板！这是真正的Jade而不是jade-handlebars或某种半成品的Jade。它非常棒，但需要Meteor UI，目前在名为blaze-rc1的开发版本中发布。因此，它目前无法与Meteor 0.7一起使用。

执行 'mrt add jade'

&

使用 'mrt --release blaze-rc1' 运行您的Meteor项目

https://github.com/mquandalle/meteor-jade/

如果您在同一个文件夹中同时拥有CoffeeScript和Jade文件，请在文件名前面添加“_”，以便在加载CoffeeScript文件之前先加载Jade文件，否则它将无法正确工作。

- Nearpoint

Answer 5

mrt add jade

在 client/views/templates/hello.jade 中，你可以这样做：

template(name="hello")
  h1 hello world!
  {{greeting}}

  input(type="button" value="click")

使用mrt启动您的应用程序

- lfender6445