Pug ist eine leistungsstarke Vorlagen-Engine für Node.js, die einrückungsbasierten Kurzcode in sauberes HTML kompiliert.
Elemente und Attribute (Elements & Attributes)
doctype html
html(lang="en")
head
title My Application
body
h1.heading#main-title Welcome
p Just a simple paragraph of text.
.container
| Plain text can be piped
input(type="text" name="query" placeholder="Search..." autofocus)
div(style={ color: 'red', background: '#fff' })
Kontrollfluss und Schleifen (Control Flow)
// Conditionals
if user.role === 'admin'
button.danger Delete User
else if user.isLoggedIn
a(href="/profile") Profile
else
a(href="/login") Log In
// Loops
ul
each item, index in items
li= `${index + 1}: ${item.name}`
else
li No items found.
Vorlagenvererbung und Mixins (Inheritance)
// Template inheritance (index.pug)
extends layout.pug
block title
| Home Page
block content
h1 Hello World!
// Mixins (reusable macros)
mixin userCard(name, role)
.card
h3= name
span.badge= role
if block
.card-body
block
+userCard('Alice', 'Lead Engineer')
p Alice leads the core infrastructure team.