如何将JSON包集成到Jade模板中?

时间:2016-05-22 12:42:16

标签: json node.js express pug

我可能错过了一些明显的东西,但我是这个工作流程的新手。我有一个Express应用程序设置,我使用Jade作为模板引擎。我正在尝试使用一个名为“gulp-bundle-assets”的工具,它将我的所有脚本捆绑成一个,并使用名称中的哈希输出它们(我假设是为了避免缓存问题)。它还包括一个JSON文件,该文件应该用于将脚本集成到您的应用程序中。它看起来像这样:

{
  "main": {
    "styles": "<link href='main-8e6d79da08.css' media='screen' rel='stylesheet' type='text/css'/>",
    "scripts": "<script src='main-5f17cd21a6.js' type='text/javascript'></script>"
  },
  "vendor": {
    "scripts": "<script src='vendor-d66b96f539.js' type='text/javascript'></script>",
    "styles": "<link href='vendor-23d5c9c6d1.css' media='screen' rel='stylesheet' type='text/css'/>"
  }
}

如何在Jade模板中包含此数据?我看到了一个用于编译Jade模板的实用程序来进行变量插值,这是处理它的最佳方法,还是Jade中存在一些原生的东西?

1 个答案:

答案 0 :(得分:1)

在NodeJS Express服务器中使用 JADE 时,您可能需要将数据发送到您的视图。我认为这是你需要的。由于您的数据是JSON格式,因此您需要使用JSON方法将JADE模板视图转换为清晰的格式。

尝试使用下一个示例代码:

file="filename".

您的JADE模板位于var express = require('express'); var bodyParser = require('body-parser'); var path = require('path'); let port = process.env.PORT || 3030; var app = express(); app.set('views', path.join(__dirname, 'templates')); app.set('view engine', 'jade'); app.use(bodyParser.urlencoded({ extended: false })); app.use(express.static(path.join(__dirname, 'public'))); app.get('/', function(req, res){ let jsonFile = require('./public/jsondata.json'); let jsonData = JSON.stringify(jsonFile); let json = JSON.parse(jsonData); let mStyles = json.main.styles; //You get your main styles res.render('index', { mainStyles: mStyles }); }).listen(port, function(){ console.log('Listening on' + port); }); 文件夹中,其中包含下一个内容:

templates

您正在将html(lang="en") head meta(charset="utf-8") #{mainStyles} title Hello World var传递给JADE模板文件。

  

不要忘记自定义您的JSON文件位置。