Javascript 将客户端站点pug模板编译为模块

我正在使用Node.js、Express、Parcel和Pug为一个web应用程序提供服务，它运行得非常好

包裹将我的JS捆绑到我非常满意的程度

然而，我也做了一些客户端模板，这只会增加。我目前使用使用pug cli包的解决方案编译cs pug模板（也有使用pugtalizer的替代解决方案）；但是，这两种解决方案都使用全局名称空间中的template函数将pug模板编译成JS，我只能在通过HTML

标记加载模板函数时访问该函数

这导致我不得不加载几个JS文件，这与使用Parcel将所有JavaScript捆绑到一个捆绑包中的整个尝试背道而驰

如何在我的cs javascript中导入（即使用ES6

import（）

）模板文件以便将其捆绑

更新

我刚刚分析了编译后的模板函数。我重新格式化了它，以便更好地分析正在发生的事情，并在最后向编译的模板文件添加了一个简单的导出命令，如下所示：

module.exports = { exampleTemplate }

然后，我可以将其导入到我的客户机代码中，并像往常一样使用它：

import { exampleTemplate } from '<path>/example'
...
const html = exampleTemplate ({<locals>})
document.getElementByID('target').innerHTML = html

从'/example'导入{exampleTemplate}
...
const html=exampleTemplate（{}）
document.getElementByID（'target'）。innerHTML=html

---

剩下要做的就是告诉帕格附加module.exports语句，我们有了一个解决方案…

事实证明，帕格API支持这个现成的功能，而

帕格cli

也支持这个功能

最后，我只需将我的package.json脚本更改为：

package.json

"scripts": {
    ...
    "dev:watch:pug": "pug -O '{module: true}' -c -w --name-after-file -o src/client/views src/client/views",
    ...
}