【问题标题】:compiling pug templates to single client side js file将 pug 模板编译为单个客户端 js 文件
【发布时间】:2018-08-28 23:05:10
【问题描述】:

我刚开始使用 pug 并将其用于小型单页应用程序。我正在使用编译为 javascript 函数的模板,我将在 SPA 中使用这些函数来呈现 HTML。使用 pug-cli,我能够生成多个 .js 文件,每个文件都包含所需的模板函数。但是,我不想编译多个 javascript 文件,而是想将所有函数合并到一个简单的“template.js”文件中,然后我可以从我的客户端应用程序中调用该文件。这是我目前正在使用的命令

pug -c --name-after-file -w .\views\ -o .\public\

我在 Google 上搜索过它,在 Stackoverflow 上进行了搜索,还发现 pug API 本身具有 pug.compileFileClient,这可能是为 Express 应用程序执行的。但是,我找不到这个功能是否在 pug-cli 中实现。

【问题讨论】:

    标签: javascript pug


    【解决方案1】:

    有一个名为 puglatizer 的 npm 包,它获取一个 pug 模板目录并将其编译为单个 .js 文件,该文件可以包含在您的 html 文件中,并且可以调用各个渲染函数来生成 html。

    它既可以在命令行使用 CLI 使用,也可以通过 require 导入,可以在构建过程中以编程方式调用。

    我最终使用了 CLI 版本。只需使用以下命令全局安装软件包:

    npm install puglatizer -g

    然后运行puglatizer -d path/to/templates -o /path/to/output/templates.js

    这会将 path/to/templates 文件夹中的所有模板编译为 /path/to/output中的 templates.js 文件>.

    通过脚本标签将生成的文件包含在你的html页面中。

    然后您可以通过调用puglatizer.TemplateFileName({data:"myData"}) 在Javascript 中调用模板,其中TemplateFileNamepath/to/templates 目录中您的pug 模板的文件名。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-04-09
      • 1970-01-01
      • 2017-07-09
      • 1970-01-01
      • 1970-01-01
      • 2012-10-07
      相关资源
      最近更新 更多