模板引擎配置 #
一、模板引擎概述 #
1.1 支持的模板引擎 #
| 引擎 | 包名 | 说明 |
|---|---|---|
| HTML | fiber/v2/template/html | Go标准模板 |
| Pug | fiber/template/pug | Pug/Jade模板 |
| Jet | fiber/template/jet | Jet模板 |
| Mustache | fiber/template/mustache | Mustache模板 |
| Amber | fiber/template/amber | Amber模板 |
| Handlebars | fiber/template/handlebars | Handlebars模板 |
二、HTML模板 #
2.1 安装 #
bash
go get github.com/gofiber/template/html
2.2 基本配置 #
go
package main
import (
"github.com/gofiber/fiber/v2"
"github.com/gofiber/template/html"
)
func main() {
// 创建模板引擎
engine := html.New("./views", ".html")
app := fiber.New(fiber.Config{
Views: engine,
})
app.Get("/", func(c *fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Title": "Hello, Fiber!",
})
})
app.Listen(":3000")
}
2.3 模板文件 #
html
<!-- views/index.html -->
<!DOCTYPE html>
<html>
<head>
<title>{{.Title}}</title>
</head>
<body>
<h1>{{.Title}}</h1>
</body>
</html>
2.4 高级配置 #
go
engine := html.New("./views", ".html")
// 重新加载模板(开发模式)
engine.Reload(true)
// 调试模式
engine.Debug(true)
// 自定义分隔符
engine.Delims("{{", "}}")
// 自定义函数
engine.AddFunc("upper", strings.ToUpper)
engine.AddFunc("lower", strings.ToLower)
engine.AddFunc("formatDate", func(t time.Time) string {
return t.Format("2006-01-02")
})
2.5 布局模板 #
html
<!-- views/layouts/main.html -->
<!DOCTYPE html>
<html>
<head>
<title>{{.Title}}</title>
</head>
<body>
{{template "content" .}}
</body>
</html>
<!-- views/index.html -->
{{define "content"}}
<h1>{{.Title}}</h1>
<p>{{.Message}}</p>
{{end}}
go
app.Get("/", func(c *fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Title": "Home",
"Message": "Welcome!",
}, "layouts/main")
})
三、Jet模板 #
3.1 安装 #
bash
go get github.com/gofiber/template/jet
3.2 基本配置 #
go
package main
import (
"github.com/gofiber/fiber/v2"
"github.com/gofiber/template/jet"
)
func main() {
engine := jet.New("./views", ".jet")
app := fiber.New(fiber.Config{
Views: engine,
})
app.Get("/", func(c *fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Title": "Hello, Jet!",
})
})
app.Listen(":3000")
}
3.3 Jet模板语法 #
jet
<!-- views/index.jet -->
<!DOCTYPE html>
<html>
<head>
<title>{{.Title}}</title>
</head>
<body>
<h1>{{.Title}}</h1>
<!-- 条件判断 -->
{{if .User}}
<p>Hello, {{.User.Name}}!</p>
{{else}}
<p>Please login</p>
{{end}}
<!-- 循环 -->
<ul>
{{range .Items}}
<li>{{.Name}}: ${{.Price}}</li>
{{end}}
</ul>
</body>
</html>
四、Pug模板 #
4.1 安装 #
bash
go get github.com/gofiber/template/pug
4.2 基本配置 #
go
package main
import (
"github.com/gofiber/fiber/v2"
"github.com/gofiber/template/pug"
)
func main() {
engine := pug.New("./views", ".pug")
app := fiber.New(fiber.Config{
Views: engine,
})
app.Get("/", func(c *fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Title": "Hello, Pug!",
})
})
app.Listen(":3000")
}
4.3 Pug模板语法 #
pug
//- views/index.pug
doctype html
html
head
title= Title
body
h1= Title
if User
p Hello, #{User.Name}!
else
p Please login
ul
each item in Items
li= item.Name + ': $' + item.Price
五、Mustache模板 #
5.1 安装 #
bash
go get github.com/gofiber/template/mustache
5.2 基本配置 #
go
package main
import (
"github.com/gofiber/fiber/v2"
"github.com/gofiber/template/mustache"
)
func main() {
engine := mustache.New("./views", ".mustache")
app := fiber.New(fiber.Config{
Views: engine,
})
app.Get("/", func(c *fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Title": "Hello, Mustache!",
})
})
app.Listen(":3000")
}
5.3 Mustache模板语法 #
mustache
<!-- views/index.mustache -->
<!DOCTYPE html>
<html>
<head>
<title>{{Title}}</title>
</head>
<body>
<h1>{{Title}}</h1>
{{#User}}
<p>Hello, {{Name}}!</p>
{{/User}}
{{^User}}
<p>Please login</p>
{{/User}}
<ul>
{{#Items}}
<li>{{Name}}: ${{Price}}</li>
{{/Items}}
</ul>
</body>
</html>
六、自定义函数 #
6.1 添加模板函数 #
go
engine := html.New("./views", ".html")
// 添加自定义函数
engine.AddFunc("upper", strings.ToUpper)
engine.AddFunc("lower", strings.ToLower)
engine.AddFunc("trim", strings.TrimSpace)
engine.AddFunc("formatDate", func(t time.Time) string {
return t.Format("2006-01-02 15:04:05")
})
engine.AddFunc("safe", func(s string) template.HTML {
return template.HTML(s)
})
// 使用
app.Get("/", func(c *fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Title": "hello",
"Date": time.Now(),
})
})
6.2 模板中使用 #
html
<h1>{{upper .Title}}</h1>
<p>Date: {{formatDate .Date}}</p>
七、模板继承 #
7.1 基础模板 #
html
<!-- views/layouts/base.html -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{{.Title}}</title>
{{block "head" .}}{{end}}
</head>
<body>
<header>
{{block "header" .}}
<nav>Navigation</nav>
{{end}}
</header>
<main>
{{block "content" .}}{{end}}
</main>
<footer>
{{block "footer" .}}
<p>© 2024</p>
{{end}}
</footer>
</body>
</html>
7.2 子模板 #
html
<!-- views/pages/home.html -->
{{extends "layouts/base.html"}}
{{block "head" .}}
<style>
.home { color: blue; }
</style>
{{end}}
{{block "content" .}}
<h1 class="home">Welcome Home</h1>
<p>{{.Message}}</p>
{{end}}
八、总结 #
8.1 模板引擎选择 #
| 引擎 | 特点 | 适用场景 |
|---|---|---|
| HTML | Go标准模板 | 简单项目 |
| Jet | 功能强大 | 复杂项目 |
| Pug | 简洁语法 | 前端团队 |
| Mustache | 简单通用 | 跨语言项目 |
8.2 下一步 #
现在你已经了解了模板引擎配置,接下来让我们学习 模板渲染,了解模板渲染的详细用法!
最后更新:2026-03-28