CODEWITHSUNDEEP
htmlgruntjspug
Surya Raj M
Surya Raj M

Reputation: 1128

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

I am new to pug/jade. I have 3 pug template files named "layout.pug", "home.pug" and "mixins.pug". The layout.pug contains following code:

html
  include mixins
  body
    include home

The code in this home.pug file:

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

The pug file 'mixins.pug' contains mixins. I have added the mixin popup() to this file. The code in this file:

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

But when I compile my pug files using grunt pug command, I got an error "pug_mixins.popup is not a function".

If you know the reason, kindly help me.

Upvotes: 2

Views: 1446

Answers (1)

Surya Raj M
Surya Raj M

Reputation: 1128

I got the answer to this question.

The reason of the error: I had included the mixins.pug in the layout.pug file. But the mixin popup(title, description) is called from the home.pug file. So the mixin is not available in the home.pug file. (The home.pug is also included in layout.pug file. So I included the mixins.pug only in the layout.pug file).

Solution: I removed the code include mixins from layout.pug file and added it to the home.pug file.

Code: layout.pug file

html
   body
      include home

home.pug file

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

mixins.pug file

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

Upvotes: 5

Related Questions