Pug 文件编译 returns 未找到 mixins.pug 的错误

Question

我是 pug/jade 的新手。我有 3 个名为 "layout.pug"、"home.pug" 和 "mixins.pug" 的哈巴狗模板文件。 layout.pug 包含以下代码：

html
  include mixins
  body
    include home

此 home.pug 文件中的代码：

body
  div.main
    +popup('Hello', 'Hello World')

哈巴狗文件 'mixins.pug' 包含 mixin。我已将 mixin popup() 添加到此文件中。此文件中的代码：

mixin popup(title, description)
 div.pop-up-body
   h2 #{title}
   p #{description}

但是当我使用 grunt pug 命令编译我的 pug 文件时，我得到了一个错误 "pug_mixins.popup is not a function".

如果你知道原因，请帮助我。

Answer 1

我得到了这个问题的答案。

错误原因： 我已将 mixins.pug 包含在 layout.pug 文件中。但是 mixin popup(title, description) 从 home.pug 文件调用。所以 mixin 在 home.pug 文件中不可用。（home.pug 也包含在 layout.pug 文件中。所以我只在 layout.pug 文件中包含了 mixins.pug。

解法： 我从 layout.pug 文件中删除了代码 include mixins 并添加了它到 home.pug 文件。

代码： layout.pug 文件

html
   body
      include home

home.pug 文件

include mixins
div.main
   +popup('Hello', 'Hello World')

mixins.pug 文件

mixin popup(title, description)
   div.pop-up-body
       h2 #{title}
       p #{description}

Pug 文件编译 returns 未找到 mixins.pug 的错误

Pug file compilation returns an error of mixins.pug is not found

html

gruntjs

pug