模板引擎配置 #

一、模板引擎概述 #

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>&copy; 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