Nunjucks Installed

Use the Nunjucks template engine to create pages and layouts.

See available Options in Deno Doc

Installation

This plugin is installed by default. 🎉

Description

Nunjucks is a powerful template language created by Mozilla and inspired by ninja2. This plugin allows you to use it to create pages and layouts.

Configuration

If you want to change the default configuration, use the second argument of lume() function in your _config.ts file. See all available options in Deno Doc.

For example, let's configure nunjucks and change the default folder of the _includes:

// Nunjucks plugin configuration
const nunjucks = {
  includes: "_layouts",
  options: {
    throwOnUndefined: true,
  },
};

// Apply the plugin config
const site = lume({}, { nunjucks });

Now, Lume will search the .njk templates in the directory _layouts instead of _includes.

Creating layouts

Add a file with .njk extension in the _includes directory. Use the front matter to set data to the template.

---
title: Welcome to my page
intro: This is my first post using Lume. I hope you like it!
---

<html>
  <head>
    <title>{{ title }}</title>
  </head>

  <body>
    <p>{{ intro }}</p>
  </body>
</html>

Creating pages

Creating pages is the same as creating layouts; just place the .njk file outside the _includes directory.

njk filter

The Nunjucks plugin also registers the njk filter, to render any string value as a Nunjucks template and output it as HTML. The filter accepts an object with data.

---
data:
  username: Oscar
text: "Hello {{ username }}"
---

<!-- Render a string -->
<div>{{ text | njk(data) | safe }}<div>