Questions tagged [pug]

Pug (formerly known as Jade) is a robust, elegant and feature-rich template engine for Node.js.

Pug (formerly Jade) is a clean, whitespace-sensitive syntax for writing HTML. Here is a simple example:

doctype html
html(lang="en")
  head
    title= pageTitle
    - if (foo) bar(1 + 5)
  body
    h1 Pug - node template engine
    #container.col
      if youAreUsingPug
        p You are amazing
      else
        p Get on it!
      p.
        Pug is a terse and simple templating language with a
        strong focus on performance and powerful features.

Produces following output as HTML:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Pug</title>
    <script type="text/javascript">
      if (foo) bar(1 + 5)
    </script>
  </head>
  <body>
    <h1>Pug - node template engine</h1>
    <div id="container" class="col">
      <p>You are amazing</p>
      <p>Pug is a terse and simple templating language with a strong focus on performance and powerful features.</p>
    </div>
  </body>
</html>

Links

6377 questions
35
votes
3 answers

Is it considered bad practice to use HTML in Jade?

Jade looks like a cool templating engine and I think I'll be using it for my next project. However, some of the syntax doesn't make sense to me. What do you get by doing this: ul li a(href="#book-a") Book A instead of:
33
votes
1 answer

Pass variables to base layout from extending pug/jade template

I would like to set a class on the body tag by declaring a variable in a template that extends a base layout. When I try, the body_class variable is undefined in the layout. It appears the layout is executed before the extending template, or they…
Mike Causer
  • 8,196
  • 2
  • 43
  • 63
33
votes
2 answers

Block comments in Pug (Jade)?

How do you block comment out code in the Pug templating engine? I know how to comment out a line: //-doesn't show but I don't want to have to write in full html comments like so:
sidonaldson
  • 24,431
  • 10
  • 56
  • 61
32
votes
2 answers

Concatenating a variable + string in Jade file

I am passing in a session variable from my mongodb session store in an Express for Node.js web app like this: exports.dashboard = function(req, res){ res.render('dashboard', {pref: req.session.layoutpref}); } Then, in my Jade file I'm trying to…
gjw80
  • 1,058
  • 4
  • 18
  • 36
31
votes
4 answers

Jade: Change active menu item in parent template

I have a navigation bar in my parent jade template and I'd like to highlight the item which is currently in view. So if I'm on the blog page, ul li Home li.active Blog li Contact Us li About Without copying the navigation bar structure…
Adam Grant
  • 12,477
  • 10
  • 58
  • 65
31
votes
2 answers

node.js - what are the advantages of using jade

I learnt that JADE is a template language and it is preferred engine for express. What are the advantages of using JADE instead of html ? Is it possible to use html directly instead of using jade ?
Vinoth
  • 5,687
  • 11
  • 44
  • 56
30
votes
3 answers

How does `aws s3 sync` determine if a file has been updated?

When I run the command in the terminal back to back, it doesn't sync the second time. Which is great! It shouldn't. But, if I run my build process and run aws s3 sync programmatically, back to back, it syncs all the files both times, as if my build…
Costa Michailidis
  • 7,691
  • 15
  • 72
  • 124
30
votes
4 answers

Is there any way to use multiple view engines with Express + Node.js

Scenario: I had developed some transactional pages using Node.js, Express + Handlebars as view engine and MongoDB. Now the issue is during module integration I got some of the pages which are built on Express + Jade as view engine. Question: How to…
Amol M Kulkarni
  • 21,143
  • 34
  • 120
  • 164
29
votes
8 answers

Accessing Express.js req or session from Jade template

I am wondering if there is an easy way to access Express.js' req or session variables from within a Jade template without passing it in through the normal response. Or is this the only way? res.render('/', { session: req.session });
MrBojangles
  • 1,423
  • 3
  • 14
  • 16
29
votes
3 answers

Foreach loop in jade (node.js template engine)

Ok, I am getting an associative array from node server and trying to render it in Jade. I obviously need a foreach loop, but nothing seems to work! I tried these both codes: - foreach row in rows { li= row - } and - rows.forEach(function(item))…
user1130217
28
votes
3 answers

Equivalent to $.fn.load without jQuery

I want to load some Jade content into a certain div on button click. I have found how to do this with jQuery, there are several posts on it, and essentially what I want to do is $('#div').load('/somePage'); However, I am unable to use jQuery in my…
perennial_
  • 1,798
  • 2
  • 26
  • 41
27
votes
1 answer

Put Jade local variable in tag attribute

I want to put Jade variable in tag attribute but it isn't evaluated. a(href="/logout/#{user.name}")
teerapap
  • 5,303
  • 7
  • 33
  • 40
27
votes
1 answer

Using binary data from Mongo collection as image source

I have an express app, storing data in mongo, using Jade as the view engine. I have a simple route that gets the docs in a particular collection, each doc corresponding to a product. The image is base64 encoded. When I try and render as an image…
Philip O'Brien
  • 4,146
  • 10
  • 46
  • 96
27
votes
2 answers

how to upload and read a file with nodejs / express

there are all kinds of posts about this, but I'm still not getting it. I want to upload a *.csv and read and process its contents. my jade file is this //views/import.jade extends layout block content h1= title form(action="/import",…
Simply Seth
  • 3,246
  • 17
  • 51
  • 77
27
votes
1 answer

how do you link css to a jade file?

I am currently trying to link normalize.css but its not working (using socket an express) html head title= "Real time web chat" link(href='/css/normalize.css') script(src='/chat.js') …
Swat Designz
  • 283
  • 1
  • 3
  • 5