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
257
votes
8 answers

How can I render inline JavaScript with Jade / Pug?

I'm trying to get JavaScript to render on my page using Jade (http://jade-lang.com/) My project is in NodeJS with Express, eveything is working correctly until I want to write some inline JavaScript in the head. Even taking the examples from the…
JMWhittaker
  • 3,633
  • 3
  • 23
  • 30
169
votes
9 answers

How can I get Express to output nicely formatted HTML?

When using Express for Node.js, I noticed that it outputs the HTML code without any newline characters or tabs. Though it may be more efficient to download, it's not very readable during development. How can I get Express to output nicely formatted…
Stephen
  • 7,994
  • 9
  • 44
  • 73
146
votes
9 answers

Syntax highlighting for Jade in Sublime Text 2?

I just started using Sublime Text 2 on Mac. I also just started using Jade for my views in Node.js, and am wondering if there is a way to add syntax highlighting for Jade into Sublime Text 2.
James Simpson
  • 13,488
  • 26
  • 83
  • 108
140
votes
23 answers

Change the "No file chosen":

I have a button "Choose file" as follows (I am using Jade but it should be the same as Html5): input(type='file', name='videoFile') In the browser this shows a button with a text next to it "No file chosen". I would like to change the "No file…
FranXh
  • 4,481
  • 20
  • 59
  • 78
128
votes
6 answers

How to pass variable from jade template file to a script file?

I'm having trouble with a variable (config) declared in a jade template file (index.jade) that isn't passed to a javascript file, which then makes my javascript crash. Here is the file (views/index.jade): h1…
Michael Eilers Smith
  • 8,466
  • 20
  • 71
  • 106
128
votes
13 answers

Jade: Links inside a paragraph

I'm trying to author a few paragraphs with Jade, but finding it difficult when there are links inside a paragraph. The best I can come up with, and I'm wondering if there's a way to do it with less markup: p span. this is the start of the…
mahemoff
  • 44,526
  • 36
  • 160
  • 222
122
votes
10 answers

What's the use of Jade or Handlebars when writing AngularJs apps

I am new(ish) to the whole javascript full stack applications, and completely new to Angular, so I was hoping somebody can put the record straight for me here. Why would I need to use a templating framework like Jade or Handlebars when writing…
Jay Pete
  • 4,123
  • 4
  • 35
  • 51
122
votes
2 answers

What are the pros and cons of both Jade and EJS for Node.js templating?

Jade versus EJS, what are the pros and cons of each and what purposes are each designed for? Are there any other express-compatible template engines that are good and why?
HaoQi Li
  • 11,970
  • 14
  • 58
  • 77
107
votes
13 answers

Using HTML in Express instead of Jade

How to I get rid of Jade while using Express with Node.JS? I want to just use plain html. In other articles I have seen that people recommended app.register() which is now deprecated in the latest version.
Sanchit Gupta
  • 1,283
  • 2
  • 11
  • 8
96
votes
11 answers

Node - how to run app.js?

I am very new to Node.js and I tried to run a project (made by other developer) by having a command in terminal node app.js. But I encountered below error, do you have any idea how to run this project? I followed few instructions here to run a…
JunM
  • 7,040
  • 7
  • 37
  • 58
83
votes
7 answers

Jade - Template Engine: How to check if a variable exists

I'm currently using Jade on a new project. I want to render a page and check if a certain variable is available. app.js: app.get('/register', function(req, res){ res.render('register', { locals: { title: 'Register', …
mbecker
  • 1,663
  • 3
  • 19
  • 24
81
votes
6 answers

Jade conditional (if/else) to add class to div inline

Is there a way to do this inline in a jade template? if(typeof fromEdit != 'undefined') div#demo.collapse.in else div#demo.collapse Would like to do this conditional check "inline" and the result would add the .in to the end of the div if…
jstevens13
  • 1,235
  • 3
  • 11
  • 9
80
votes
2 answers

Comments in Jade/pug

I tried making comments in Jade/pug, but the comments render as text in the HTML. This is my code: doctype html html(lang='en') body / This should be a comment What am I doing something stupid?
Randomblue
  • 112,777
  • 145
  • 353
  • 547
80
votes
21 answers

Error: Failed to lookup view in Express

Note: my auto answer at end of the post I'm trying to make a better experience of nodeJS and i don't really like to get all the script in one file. so, following a post here i use this structure ./ config/ enviroment.js routes.js public/ …
nax
  • 1,184
  • 1
  • 8
  • 19
76
votes
12 answers

What about Line Breaks in Jade?

I'm pretty sure that this is a no-brainer but I didn't find any snippet of sample code. What's the best way to insert line breaks (aka the good ol' br/)? As far as I can see if I put a "br" at the beginning of an empty line, it is rendered as
Matteo
  • 1,217
  • 1
  • 13
  • 17
1
2 3
99 100