如何向Pug模板添加JavaScript函数

将JavaScipt添加到Pug模板时存在许多问题，包括：

• PugJS在许多JavaScript函数上抛出异常，这些函数完全有效
• 当JavaScript函数出现语法错误时，不会为您识别它们
• 不能在Pug模板内的JavaScript函数中设置断点
• 您不能使用Typescript来帮助增强健壮性

---

在Pug中使用JavaSript函数的首选/推荐方法是什么？

在意识到有更好的选择之前，我曾与这些问题斗争过一段时间。我建议将JavaScript函数传递给Pug render函数，而不是将它们构建到模板中

我以前做的是这个JavaScript

const render=pug.compileFile（path.join（uu dirname，../templates/sandbox.pug'）；
consthtml=render（{}）；

这个哈巴狗模板呢

- var testFunc = function(){
-     return "Test func";
-   }

div #{testFunc()} worked!

div #{testFunc()} worked!

实现同样目标的更好方法是使用此JavaScript

const render=pug.compileFile（path.join（uu dirname，../templates/sandbox.pug'）；
常量html=render({
testFunc:function（）{
返回“testfunc”；
}
});

这个哈巴狗模板呢

- var testFunc = function(){
-     return "Test func";
-   }

div #{testFunc()} worked!

div #{testFunc()} worked!

这允许您设置断点，使用Typescript和所有其他很酷的东西，并避免了与解析JavaScript不太好相关的所有Pug错误