Stand with Ukraine 🇺🇦
Eleventy
The possum is Eleventy’s mascot

Eleventy Documentation

Menu

Events Jump to heading

You may want to run some code at certain times during the compiling process. To do that, you can use configuration events, which will run at specific times during the compiling process.

All events are configured in your .eleventy.js configuration file, with the code run every time the event triggers.

Asynchronous callback function support added in v1.0.

eleventy.before New in v1.0.0 Jump to heading

The eleventy.before event runs every time Eleventy starts building, so it will run before the start of each stand-alone build, as well as each time building starts as either part of --watch or --serve. To use it, attach the event handler to your Eleventy config:

module.exports = function (eleventyConfig) {
  // Async-friendly in 1.0+
  eleventyConfig.on('eleventy.before', async () => {
    // Run me before the build starts
  });
};

eleventy.after New in v1.0.0 Jump to heading

The eleventy.after event runs every time Eleventy finishes building, so it will run after the end of each stand-alone build, as well as each time building ends as either part of --watch or --serve. To use it, attach the event handler to your Eleventy config:

module.exports = function (eleventyConfig) {
  // Async-friendly in 1.0+
  eleventyConfig.on('eleventy.after', async () => {
    // Run me after the build ends
  });
};

Event arguments Coming soon in v2.0.0 Jump to heading

Eleventy now provides an object with metadata on the build as an argument to the eleventy.before and eleventy.after event callbacks.

module.exports = function (eleventyConfig) {
  eleventyConfig.on('eleventy.before', async ({ dir, runMode, outputMode }) => {
    // Read more below
  });

  eleventyConfig.on('eleventy.after', async ({ dir, results, runMode, outputMode }) => {
    // Read more below
  });
};

eleventy.beforeWatch New in v1.0.0 Jump to heading

The eleventy.beforeWatch event runs before a build is run only if it's a re-run during --watch or --serve. This means it will neither run during the initial build nor during stand-alone builds. To use it, attach the event handler to your Eleventy config:

module.exports = function (eleventyConfig) {
  // Async-friendly in 1.0+
  eleventyConfig.on('eleventy.beforeWatch', async (changedFiles) => {
    // Run me before --watch or --serve re-runs

    // changedFiles is an array of files that changed
    // to trigger the watch/serve build
  });
};

The changedFiles parameter was New in v0.11.1.

Other pages in Configuration: