Menu
- Why Eleventy?
- Getting Started
- Community
- Working with Templates
- Using Data
- Configuration
- Template Languages
- Plugins
- API Services
- Release History
- Advanced
Eleventy
1.93s
Astro
22.90s
Pug
Template Languages:
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. |