Skip to navigation Skip to main content
Blog
Eleventy, 2025 in Review
Versions
Stable
3.1.2
Canary
4.0.0-alpha.6

EJS

EJS, short for Embedded JavaScript, is a template language that emphasizes the use of plain JavaScript instead of having its own template syntax. It can be really convenient if you're fluent in JavaScript. As opposed to languages like Mustache that bill themselves as 'logic-less', EJS lets you use as much logic as you'd like.

On this page
Eleventy Short Name File Extension npm Package
ejs .ejs ejs
Eleventy or Plugin version ejs version
@11ty/eleventy@0.x ejs@2.x
@11ty/eleventy@1.x ejs@3.x
@11ty/eleventy@2.x ejs@3.x
@11ty/eleventy@3.x and newer N/A
@11ty/eleventy-plugin-ejs@1.x ejs@3.x

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

Installation

The ejs templating language was moved out of Eleventy core in v3 and now requires a plugin installation.

Install from npm:

npm install @11ty/eleventy-plugin-ejs

Add to your configuration file:

eleventy.config.js
import ejsPlugin from "@11ty/eleventy-plugin-ejs";

export default function (eleventyConfig) {
	eleventyConfig.addPlugin(ejsPlugin);
}
const ejsPlugin = require("@11ty/eleventy-plugin-ejs");

module.exports = function (eleventyConfig) {
	eleventyConfig.addPlugin(ejsPlugin);
}

Use more ejs options (full options list):

eleventy.config.js
import ejs from "ejs";
import ejsPlugin from "@11ty/eleventy-plugin-ejs";

export default function (eleventyConfig) {
	eleventyConfig.addPlugin(ejsPlugin, {
		async: false, // default

		// use <? ?> instead of <% %>
		delimiter: "?",

		// Override the `ejs` library instance
		eleventyLibraryOverride: ejs,
	});
}
const ejs = require("ejs");
const ejsPlugin = require("@11ty/eleventy-plugin-ejs");

module.exports = function (eleventyConfig) {
	eleventyConfig.addPlugin(ejsPlugin, {
		async: false, // default

		// use <? ?> instead of <% %>
		delimiter: "?",

		// Override the `ejs` library instance
		eleventyLibraryOverride: ejs,
	});
}

Supported Features

Feature Syntax
✅ Include (Preprocessor Directive) <% include /user/show %> looks for _includes/user/show.ejs (the leading slash is important). Does not process front matter in the include file.
✅ Includes (Relative Path, Preprocessor Directive) Relative paths in ejs can leave off the leading slash / or use ./ to use the template’s directory or ../ for the template’s parent directory:
<% include 'user/show' %> or <% include './user/show' %> looks for ./user/show.ejs from the template’s current directory. Does not process front matter in the include file.
✅ Include (pass in Data) <%- include('/user/show', {user: 'Ava'}) %> looks for _includes/user/show.ejs. Does not process front matter in the include file.
✅ Include (Relative Path, pass in Data) Relative paths in ejs can leave off the leading slash / or use ./ to use the template’s directory or ../ for the template’s parent directory:
<%- include('user/show', {user: 'Ava'}) %> or <%- include('./user/show', {user: 'Ava'}) %> looks for ./user/show.ejs from the template’s current directory. Does not process front matter in the include file.
Template Languages: