Pug

home terminal code menu_book edit

Pug is an open source template language created in 2010 by Tj Holowaychuk.

Source code:

git clone https://github.com/pugjs/pug

#110on PLDB

14Years Old

12kRepos

Try now: Web · Riju

Pug – robust, elegant, feature rich template engine for Node.js

Pug website
Pug is developed on GitHub and has 20,817 stars
Pug docs
There are at least 11,560 Pug repos on GitHub
Pug first developed in https://github.com/pugjs
file extensions for Pug include jade and pug
The Google BigQuery Public Dataset GitHub snapshot shows 528 users using Pug in 575 repos on GitHub
Monaco package for syntax highlighting Pug
Pygments supports syntax highlighting for Pug
GitHub supports syntax highlighting for Pug

Example from Riju:

html
  body
    p Hello, world!

Example from hello-world:

doctype html
html
    head
       title Hello World
    body
       h1 Hello World

Example from Linguist:

p.
  Hello,
  World!

Pug Keywords

append block case default doctype each else extends for if in include mixin typeof unless var when

Feature	Supported	Token	Example
Inheritance	✓
Comments	✓		// A comment
Line Comments	✓	//	// A comment
Strings	✓
Assignment	✓		- var title = "On Dogs: Man's Best Friend"; h1= title
Functions	✓		mixin article(title) .article .article-wrapper h1= title if block block else p No content provided +article('Hello world') +article('Hello world') p This is my p Amazing article
Switch Statements	✓		- var friends = 10 case friends when 0 p you have no friends when 1 p you have a friend default p you have #{friends} friends
Conditionals	✓		- var user = {description: 'foo bar baz'} - var authorised = false #user if user.description h2.green Description p.description= user.description else if authorised h2.blue Description p.description. User has no description, why not add one... else h2.red Description p.description User has no description
File Imports	✓		//- index.pug doctype html html include includes/head.pug body h1 My Site p Welcome to my super lame site. include includes/foot.pug
hasForEachLoops	✓		ul each val in [1, 2, 3, 4, 5] li= val
Semantic Indentation	✓

Feature

Supported

Token

Example

Inheritance

✓

Comments

✓

// A comment

Line Comments

✓

// A comment

Strings

✓

Assignment

✓

- var title = "On Dogs: Man's Best Friend";

h1= title

Functions

✓

mixin article(title)
  .article
    .article-wrapper
      h1= title
      if block
        block
      else
        p No content provided

+article('Hello world')

+article('Hello world')
  p This is my
  p Amazing article

Switch Statements

✓

- var friends = 10
case friends
  when 0
    p you have no friends
  when 1
    p you have a friend
  default
    p you have #{friends} friends

Conditionals

✓

- var user = {description: 'foo bar baz'}
- var authorised = false
#user
  if user.description
    h2.green Description
    p.description= user.description
  else if authorised
    h2.blue Description
    p.description.
      User has no description,
      why not add one...
  else
    h2.red Description
    p.description User has no description

File Imports

✓

//- index.pug
doctype html
html
  include includes/head.pug
  body
    h1 My Site
    p Welcome to my super lame site.
    include includes/foot.pug

hasForEachLoops

✓

ul
  each val in [1, 2, 3, 4, 5]
    li= val

Semantic Indentation

✓

Pug - Template language

Language features