javascript - jade to pug migration => 无法读取函数调用中未定义的属性 'every'

Question

我们有一个可以工作的 jade 渲染器，它还可以包含通过函数渲染的 html。

// a function that is placed in the options object for jade.render
const someFunction = (para1, para2) {
  // some logic that gets a complete template from a source
  const template = (src) = `img.someClass(src=${src})`;
  // And returns the jade rendered variant of that template
  return jade.render(template, { src: para1 });
}

// # .jade file
div(class=(cover.hasCustomLogo ? 'cover coverWithCustomLogo' : 'cover'))
  img.logo(src=cover.logo)
  p.title=cover.title
  p.extension=cover.extension
  !{someFunction(cover.src)}

迁移到 pug 后，我们收到错误 Cannot read property 'every' of undefined。

经过一些调查，这导致了 pug 文件中的 !{someFunction(cover.src)} 代码。通过将代码更改为 #{someFunction(cover.src)}，错误不再发生，但 Pug 开始添加打开和关闭符号。

关于如何解决这个问题有什么想法吗？

在 pug 之前呈现 html

<div class="cover">
  <img class="logo" src="test.jpg">
  <p class="title"></p>
  <p class="extension"></p>
  <img class="someClass" src="otherJPG.jpg">
</div> 

使用插值法在 pug 之后呈现 html

<div class="cover">
  <img class="logo" src="test.jpg">
  <p class="title"></p>
  <p class="extension"></p>
  <<img class="someClass" src="otherJPG.jpg">>
</div> 

Answer 1

经过几个小时的尝试和失败，错误解决如下。

!{} 在哈巴狗中不再起作用，因为 !指向文档类型标签。

通过使用 | 解决了它象征。解决方案就变成了

div(class=(cover.hasCustomLogo ? 'cover coverWithCustomLogo' : 'cover'))
  img.logo(src=cover.logo)
  p.title=cover.title
  p.extension=cover.extension
  | !{someFunction(cover.src)}

解决方案是在阅读了以下 stackoverflow 问题后得出的 How to insert raw HTML in Pug file (not include external HTML file)