浏览器支持
把jade编译为一个可供浏览器使用的单文件,只需要简单的执行:
$ make jade.js
如果你已经安装了uglifyjs (npm install uglify-js
),你可以执行下面的命令它会生成所有的文件。其实每一个正式版本里都帮你做了这事。
$ make jade.min.js
默认情况下,为了方便调试Jade会把模板组织成带有形如 __.lineno = 3
的行号的形式。 在浏览器里使用的时候,你可以通过传递一个选项{ compileDebug: false }
来去掉这个。 下面的模板
p Hello #{name}
会被翻译成下面的函数:
function anonymous(locals, attrs, escape, rethrow) {
var buf = [];
with (locals || {}) {
var interp;
buf.push('\n<p>Hello ' + escape((interp = name) == null ? '' : interp) + '\n</p>');
}
return buf.join("");
}
通过使用Jade的 ./runtime.js
你可以在浏览器使用这些预编译的模板而不需要使用Jade, 你只需要使用runtime.js里的工具函数, 它们会放在jade.attrs
, jade.escape
这些里。 把选项 { client: true }
传递给 jade.compile()
, Jade 会把这些帮助函数的引用放在jade.attrs
, jade.escape
.
function anonymous(locals, attrs, escape, rethrow) {
var attrs = jade.attrs, escape = jade.escape, rethrow = jade.rethrow;
var buf = [];
with (locals || {}) {
var interp;
buf.push('\n<p>Hello ' + escape((interp = name) == null ? '' : interp) + '\n</p>');
}
return buf.join("");
}