当前位置: 首页 > news >正文

express的模板handlebars用app.engine()创建配置和用exphbs.create()的区别

在使用 express-handlebars 时,app.engine 和 exphbs.create 都可以用来配置 Handlebars 模板引擎,但它们的使用方式和功能有一些区别。以下是详细的对比和说明

  1. app.engine 方法
    app.engine 是 Express 提供的方法,用于注册一个新的模板引擎。在使用 express-handlebars 时,通常通过 app.engine 来配置 Handlebars 模板引擎。
const express = require('express');
const exphbs = require('express-handlebars');const app = express();// 使用 app.engine 注册模板引擎
app.engine('handlebars', exphbs({defaultLayout: 'main',	//默认模板或主布局文件名extname: '.hbs',	//模板的后缀扩展名partialsDir: ['views/partials/', 'views/common/'],	//局部文件和块级文件的路径viewsDir: 'views/',	//视图文件路径layoutsDir: 'views/layouts/',	helpers: {customHelper: function(value) {return value.toUpperCase();}}
}));// 设置模板引擎
app.set('view engine', 'handlebars');// 示例路由
app.get('/', (req, res) => {res.render('index', { title: 'Home Page' });
});app.listen(3000, () => {console.log('Server is running on http://localhost:3000');
});
  1. exphbs.create 方法
    exphbs.create 是 express-handlebars 提供的一个方法,用于创建一个新的 Handlebars 实例。这个实例可以独立于默认的 Handlebars 实例,允许你在不同的环境中隔离配置和模板。
const express = require('express');
const exphbs = require('express-handlebars');const app = express();// 使用 exphbs.create 创建一个新的 Handlebars 实例
const hbs = exphbs.create({defaultLayout: 'main',extname: '.hbs',partialsDir: ['views/partials/', 'views/common/'],viewsDir: 'views/',layoutsDir: 'views/layouts/',helpers: {customHelper: function(value) {return value.toUpperCase();}}
});// 使用创建的实例注册模板引擎
app.engine('handlebars', hbs.engine);// 设置模板引擎
app.set('view engine', 'handlebars');// 示例路由
app.get('/', (req, res) => {res.render('index', { title: 'Home Page' });
});app.listen(3000, () => {console.log('Server is running on http://localhost:3000');
});
  1. 区别和不同
    3.1 功能隔离
    app.engine:直接将配置传递给 express-handlebars,并注册到 Express 的模板引擎中。这种方式简单直接,但所有配置都作用于全局。
    exphbs.create:创建一个新的 Handlebars 实例,允许你在不同的环境中隔离配置和模板。这在大型项目中非常有用,特别是当你需要多个独立的模板配置时。
    3.2 配置灵活性
    app.engine:配置选项直接传递给 express-handlebars,适用于简单的项目配置。
    exphbs.create:通过创建一个新的实例,可以更灵活地管理配置。例如,你可以在不同的路由或中间件中使用不同的 Handlebars 实例。
    3.3 使用场景
    app.engine:适用于大多数简单的 Express 项目,配置简单且直接。
    exphbs.create:适用于需要高度隔离和灵活配置的项目,例如多租户应用或大型项目。
  2. 总结
    app.engine:适合大多数简单的项目,直接将配置传递给 express-handlebars,并注册到 Express 中。
    exphbs.create:适合需要高度隔离和灵活配置的项目,通过创建独立的 Handlebars 实例来管理配置。
    根据你的项目需求选择合适的方式。如果你的项目结构简单,直接使用 app.engine 即可;如果你需要更复杂的配置和隔离,可以使用 exphbs.create

下面详细解释下配置文件中的路径和作用:

  1. defaultLayout: ‘main’
    含义:指定默认的布局文件名(不包含扩展名)。
    路径:布局文件位于 layoutsDir 指定的目录中。
    文件:views/layouts/main.hbs
    作用:当渲染视图时,如果没有显式指定布局文件,将使用这个默认布局文件。

  2. extname: ‘.hbs’
    含义:指定模板文件的扩展名。
    路径:这个选项不影响路径,但决定了模板文件的扩展名。
    文件:所有模板文件的扩展名应该是 .hbs,例如 index.hbs、main.hbs 等。
    作用:告诉 express-handlebars 哪些文件是模板文件。

  3. partialsDir: [‘views/partials/’, ‘views/common/’]
    含义:指定块级模板(partials)的目录路径。
    路径:可以是一个字符串或字符串数组,表示多个目录。
    文件:
    views/partials/ 下的文件,例如 header.hbs、footer.hbs。
    views/common/ 下的文件,例如 sidebar.hbs。
    作用:在模板中可以通过 {{> partialName}} 引用这些块级模板。例如:

{{> header}}
<p>Main content</p>
{{> footer}}
  1. viewsDir: ‘views/’
    含义:指定视图文件的目录路径。
    路径:相对于当前工作目录的路径。
    文件:所有视图文件位于这个目录下,例如 views/index.hbs。
    作用:当调用 res.render(‘index’) 时,Express 会在 viewsDir 指定的目录中查找 index.hbs 文件。

  2. layoutsDir: ‘views/layouts/’
    含义:指定布局文件的目录路径。
    路径:相对于当前工作目录的路径。
    文件:所有布局文件位于这个目录下,例如 views/layouts/main.hbs。
    作用:布局文件用于包裹视图文件,提供统一的页面结构。默认布局文件由 defaultLayout 指定。

相关文章:

  • Vue3后代组件多祖先通讯设计方案
  • MATLAB基础应用精讲-【基础知识篇】发布和共享 MATLAB 代码
  • ThinkPHP6模型中多组条件逻辑或Or查询的使用
  • BiliNote:开源的AI视频笔记生成工具,让知识提取与分享更高效——跨平台自动生成结构化笔记,实现从视频到Markdown的智能转化
  • Shell脚本-for循环应用案例
  • 算法训练营 Day1
  • OAuth2AuthorizationEndpointFilter类介绍、应用场景和示例代码
  • 第3讲、大模型如何理解和表示单词:词嵌入向量原理详解
  • Java面试高频问题(26-28)
  • AI新战局:Gemini 2.5 Pro强势挑战OpenAI o3,谁是真“全能”?“锯齿AGI”时代已来临?
  • 中国250米土壤质地类型数据
  • 筑牢数字防线:商城系统安全的多维守护策略
  • Ubuntu18.04更改时区(图文详解)
  • 【Python数据库与后端开发】从ORM到RESTful API
  • 前端基础之《Vue(11)—自定义指令》
  • 全栈国产化信创适配,构建安全可控的呼叫中心系统
  • 【安全扫描器原理】TCP/IP协议编程
  • 力扣面试150题--环形链表和两数相加
  • 【滑动窗口+哈希表/数组记录】Leetcode 438. 找到字符串中所有字母异位词
  • C语言中操作字节的某一位
  • 最近这75年,谁建造了上海?
  • 找化学的答案,解人类的命题:巴斯夫的“变革者”成长之道
  • 程璧“自由生长”,刘卓辉“被旋律牵着走”
  • 夜读丨庭院春韵
  • 交警不在就闯红灯?上海公安用科技手段查处非机动车违法
  • 安徽一交通事故责任认定引质疑:民警和司法鉴定人被处罚,已中止诉讼