主页 / 问题 / 1429902
Accepted
Streammer
Asked:2022-07-15 14:36:22 +0000 UTC2022-07-15 14:36:22 +0000 UTC

如何从 pug 模板中的 json 文件中获取数据？

  • 772

我有一个 dataset.json 文件和一个 index.pug 文件在文件中我有一个 -let 数据变量。如何将 dataset.json 文件中的数据获取到 index.pug 文件中的数据变量中，稍后我将在其中通过 for 循环或其他方式生成标记。将数据放入data变量中对我来说并不重要，如果有其他选项，您也可以使用它。我这样做了。创建了一个 index.js 文件，我在其中处理我的 json。

var pug = require('pug');
var fn = pug.compileFile('template.pug');
var locals = require('./dataset.json');
console.log(fn({
    name: locals
}));
console.log(locals)

我处理的 dataset.json 文件显示在控制台中。template.pug 文件如下所示

p #{name}'s Pug source code!

这里出现了问题，我怎样才能做到这一点，以便当我在控制台中使用命令调用 template.pug 文件的程序集时

pug template.pug

在此之前，我的 index.js 处理被调用，我在哪里将我的 json 分配给 name 变量？

javascript html

1 个回答

  1. Best Answer

    创建文件夹dev创建文件夹public

    在 dev 文件夹中，创建一个dev/index.pug包含以下内容的文件。

    html(lang=lang)
  head
    title= title
  body
    h1 Hello Wolrd!
    script
      | var data = !{JSON.stringify(locals)}

    接下来，在根目录下，创建一个dataset.json包含以下内容的文件。

    {
  "lang": "ruRU",
  "title": "Test Project"
}

    我们执行命令：pug -O dataset.json dev -P -o public

    之后一个文件将出现在公用文件夹中public/index.html

    有这样的内容

    <html lang="ruRU"><head>
    <title>Test Project</title>
</head><body>
    <h1>Hello Wolrd!</h1>
    <script>
        var data = {"lang":"ruRU","title":"Test Project","filename": "src//index.pug","complieDebug": true,"pretty": true}
    </script>
</body></html>
    • 0

相关问题