有多种方法可以安装Handlebars
, 这取决于你使用的编程语言和环境变量。
Handlebars
的参考实现使用javascript
写的,它最常用的安装方式是使用npm
或yarn
:
$ npm install handlebars
# or
$ yarn add handlebars
然后你可以在程序里使用 require
来使用Handlebars
:
const Handlebars = require('handlebars');
const template = Handlebars.compile("Name:{{name}}");
console.log(template({ name: "Nils"}));
提示:
npm 或者 yarn 是使用 Handlebers 的推荐方式。但是如果你想在浏览器中使用它,我们推荐你使用构建工具,例如webpack, browserify, 或者 parcel等。
integrations 页面中包含一个可用的 loaders 插件列表,你可以使用他们去自动预编译模板或者使用Handlebars的其它方面。
浏览器构建在node_modules/handlebars/dist
目录中。让浏览器能够访问这些文件将取决于您使用的构建系统,但这可能与将文件复制到一个可访问的位置一样简单。
这是使用预编译器时的首选安装方法,因为它可以确保预编译的模板始终在运行时的相同版本上运行。
为了方便社区,提供了以下下载。它们并不用于生产,但是它们可以让您快速启动,而不需要设置构建引擎。
Handlebars
的所有最新版本和CI 构建版本都可以在S3服务的构建页面中下载。
最新通过的主版本名为handlebars-latest.js
.每个在主版本上通过的SHA都会创建一个handlebars-gitSHA.js
文件.当所有这些都通过CI持续集成后,将得到目标程序。
Handlebars
可以在一些免费CDN上获得,比如:
官方的Handlebars
构建版本在这里
Handlebars 也可以通过其它包管理工具使用:
你可以将handlebars
模板写在一个<script>
标签内,然后通过ID交付给浏览器。
<script id="entry-template" type="text/x-handlebars-template">
<div class="entry">
<h1>{{title}}</h1>
<div class="body">
{{body}}
</div>
</div>
</script>
我们可以像下面这样编译它:
var source = document.getElementById("entry-template").innerHTML;
var template = Handlebars.compile(source);
使用上下文对象和模板得到最终的HTML
:
var context = { title: "My New Post", body: "This is my first post!" };
var html = template(context);
编译结果:
<div class="entry">
<h1>My New Post</h1>
<div class="body">
This is my first post!
</div>
</div>
在前面的示例中,我们加载了Handlebars的编译器和运行时版本。预先编译模板并在网站中包含预编译的版本会更有效。您可以包含较小的运行时,并且浏览器不必在运行模板之前编译它们。
请查阅《Handlebars-预编译模板》一章