javascript - 如何在Koa项目中为Pug添加自定义模板功能？

Question

我想为 Pug View 添加自定义模板函数。

为了简单起见，我创建了一个演示文件，其中包含一个自定义函数大写:

const Koa = require("koa")
const views = require("koa-views")

const app = new Koa()

app.use(
  views(__dirname + "/views", {
    extension: "pug",
    options: {
      helpers: {
        uppercase: str => str.toUpperCase()
      }
    }
  })
)

app.use(ctx => ctx.render("index", { name: "Name1" }))

app.listen(3000)

这是一个 super 简单的模板views/index.pug:

h1=大写(名称)

但是它不起作用，它打印出这样的错误:

  TypeError: /Users/max7z/projects/test/t24__test__koa-views_pug/views/index.pug:1
    > 1| h1= uppercase(name)
      2|

  uppercase is not a function

Answer 1

没有使用 Koa，但我最近使用 Eleventy.js 解决了类似的问题与帕格。 Pug 文档在这方面并不是很好，所以花了一段时间才弄清楚。

我必须将该函数设置为全局函数，然后使用 globals渲染模板时的属性。

例如

global.uppercase = function(str){
  return str.toUpperCase();
}

app.use(
 views(__dirname + "/views", {
 extension: "pug",
 options: {
    globals: ["uppercase"]
   }
 })
)