Skip to navigation Skip to main content
11ty Logo Sustainability Fundraising
Eleventy
Eleventy Documentation
Stable
2.0.1
Canary
3.0.0-alpha.10
Toggle Menu
Eleventy 5.81s
Astro 12.52s

Pug

Contents

Eleventy Short Name File Extension npm Package
pug .pug pug

Pug templates used to be called Jade templates and the project was renamed.

You can override a .pug file’s template engine. Read more at Changing a Template’s Rendering Engine.

Pug Options Jump to heading

Optional: Compile/Render Options Jump to heading

Set compile/render options using the Configuration API. See all Pug options.

module.exports = function (eleventyConfig) {
eleventyConfig.setPugOptions({ debug: true });
};

Optional: Set your own Library instance Jump to heading

As an escape mechanism for advanced usage, pass in your own instance of the Pug library using the Configuration API.

module.exports = function (eleventyConfig) {
let pug = require("pug");
eleventyConfig.setLibrary("pug", pug);
};

Supported Features Jump to heading

Feature Syntax
✅ Includes (Absolute Path) include /includedvar.pug looks in _includes/includedvar.pug. Does not process front matter in the include file.
✅ Includes (Relative Path) Relative paths use ./ (template’s directory) or ../ (template’s parent directory).

Example: {% include ./included.pug %} looks for included.pug in the template’s current directory. Does not process front matter in the include file.
✅ Extends (Absolute Path) extends /layout.pug looks in _includes/layout.pug. Does not process front matter in the include file.
✅ Extends (Relative Path) Relative paths use ./ (template’s directory) or ../ (template’s parent directory).

Example: {% extends ./layout.pug %} looks for layout.pug in the template’s current directory. Does not process front matter in the extends file.

Other pages in Template Languages: