Skip to content

Commit

Permalink
Pug docs update for 11ty/eleventy#3081
Browse files Browse the repository at this point in the history
  • Loading branch information
zachleat committed Sep 26, 2024
1 parent 73a2573 commit 462c9b9
Showing 1 changed file with 22 additions and 12 deletions.
34 changes: 22 additions & 12 deletions src/docs/languages/pug.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,29 +16,39 @@ 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](/docs/languages/).

## Pug Options
## Installation

### Optional: Compile/Render Options {% addedin "0.2.15" %}
The `pug` templating language was moved out of Eleventy core in v3 and now requires a plugin installation.

Set compile/render options using the Configuration API. See all [Pug options](https://pugjs.org/api/reference.html#options).
```sh
npm install @11ty/eleventy-plugin-pug
```

Add to your configuration file:

{% set codeContent %}
import pugPlugin from "@11ty/eleventy-plugin-pug";

export default function (eleventyConfig) {
eleventyConfig.setPugOptions({ debug: true });
};
eleventyConfig.addPlugin(pugPlugin);
}
{% endset %}
{% include "snippets/configDefinition.njk" %}

### Optional: Set your own Library instance {% addedin "0.3.0" %}
## Pug Options

### Add Compile/Render Options

As an escape mechanism for advanced usage, pass in your own instance of the Pug library using the Configuration API.
Set compile/render options using the Configuration API. See all [Pug options](https://pugjs.org/api/reference.html#options).

{% set codeContent %}
import pug from "pug";
import pugPlugin from "@11ty/eleventy-plugin-pug";

export default function (eleventyConfig) {
eleventyConfig.setLibrary("pug", pug);
};
eleventyConfig.addPlugin(pugPlugin, {
debug: true
});
}
{% endset %}
{% include "snippets/configDefinition.njk" %}

Expand All @@ -47,6 +57,6 @@ export default function (eleventyConfig) {
| 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) {% addedin "0.2.15" %} | Relative paths use `./` (template’s directory) or `../` (template’s parent directory).<br><br>Example: `{% raw %}{% include ./included.pug %}{% endraw %}` looks for `included.pug` in the template’s current directory. Does not process front matter in the include file. |
| ✅ Includes (Relative Path) | Relative paths use `./` (template’s directory) or `../` (template’s parent directory).<br><br>Example: `{% raw %}{% include ./included.pug %}{% endraw %}` 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) {% addedin "0.2.15" %} | Relative paths use `./` (template’s directory) or `../` (template’s parent directory).<br><br>Example: `{% raw %}{% extends ./layout.pug %}{% endraw %}` looks for `layout.pug` in the template’s current directory. Does not process front matter in the extends file. |
| ✅ Extends (Relative Path) | Relative paths use `./` (template’s directory) or `../` (template’s parent directory).<br><br>Example: `{% raw %}{% extends ./layout.pug %}{% endraw %}` looks for `layout.pug` in the template’s current directory. Does not process front matter in the extends file. |

0 comments on commit 462c9b9

Please sign in to comment.