简介
在前端开发中，使用模板引擎可以让我们更加方便地管理 HTML 页面，以及更好地实现前后端分离等功能。bauer-web-templates 是一个基于 Handlebars.js 的模板引擎封装，提供了一些能够提高工作效率的功能，例如自动注册 partials、helpers 等。
安装
使用 npm 安装：
npm i bauer-web-templates
使用
初始化
在项目中引入 bauer-web-templates：
const templates = require('bauer-web-templates');接着，我们需要指定模板文件所在的目录：
templates.config({
baseDir: path.join(__dirname, 'views')
});渲染模板
1. 全局渲染
我们可以使用 render 函数来渲染模板：
templates.render('templateName', {data})
.then(html => {
console.log(html);
})
.catch(e => {
console.error(e);
});其中，'templateName' 为模板文件名，不需要加后缀名。在这里，我们可以把 {data} 传递给模板，模板中用 {{data}} 进行引用。render 函数返回一个 Promise，当 Promise resolve 后，我们可以取得渲染后的 HTML。
2. 局部渲染
我们可以使用 partials 来进行局部渲染：
-- -------------------- ---- -------
----- ---- - -
-------- ------- -------
--
-------------------------------- ------ --------- ------ ---------------
---------- -- -
------------------
--
-------- -- -
-----------------
---在这里，我们需要指定 partials，例如 {main: 'mainPartial'}。'mainPartial' 为一个局部模板文件名。在模板文件中，使用 {{> main}} 引用这个局部模板。使用 {data} 传递数据时，我们需要这样使用：{{> main data}}
后缀名自动匹配
bauer-web-templates 允许我们在使用时不需要指定后缀名，它能够根据文件名自动匹配：
templates.render('templateName', {data});在这里，我们可以不用指定后缀名，例如 '.hbs'。bauer-web-templates 会自动根据配置选择正确的后缀名。
实现 Helpers
bauer-web-templates 自动注册 helpers，我们可以在项目目录下创建 helpers 文件夹，并在其中添加 helpers：
module.exports = {
dateFormat: require('dateformat')
};在模板中，我们可以这样引用 helper：
{{dateFormat date "yyyy-mm-dd"}}其中，'dateFormat' 为 helper 名称，'date' 为参数，后面的 'yyyy-mm-dd' 为参数细节。
示例代码
views/HelloWorld.hbs
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------- --------------
-------
------
---------------
--- ------------
-------
-------views/partials/authorInfo.hbs
<div class="author-info">
<h3>{{author}}</h3>
<p>{{introduction}}</p>
</div>views/data.json
{
"text": "Hello, World!",
"author": "John Smith",
"introduction": "Hey, I'm John Smith. Nice to meet you."
}app.js
-- -------------------- ---- -------
----- --------- - -------------------------------
----- ---- - ----------------
----- ---- - -----------------------------
------------------
-------- -------------------- --------
---
------------------------------ ------ --------- ------------ ------------------------
---------- -- -
------------------
--
-------- -- -
-----------------
---这样，当我们运行 app.js 时，可以在控制台输出 HTML。
总结
bauer-web-templates 是一个当前比较流行的模板引擎。不仅支持局部渲染，还可以帮助我们更加方便地实现 helpers 等功能。希望这篇教程能够对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005568d81e8991b448d354a