Home

Add Netlify Redirects and Headers to an Eleventy Project

What seems like a simple task can be a little tricky to get right with Eleventy. Learn how to add a _redirects file to Eleventy projects deployed with Netlify.

On the surface, this seems like such a simple task: Create a _redirects or _headers file and drop them into the build directory.

The difficulty is that Eleventy is configured to not copy over any files that begin with an underscore.

Instead, we can use the concept of a static directory. Eleventy can be configured to copy all files within a directory into the build directory using the custom output directory flavor of the manual passthrough file copy option.

The configuration looks like this:

.eleventy.js

module.exports = function (eleventyConfig) {
eleventyConfig.addPassthroughCopy({ static: "/" });
};

That tells us every file in the static directory (including files with a preceding underscore) will be copied into the root of the build directory.

After adding that option, you can place your _redirects or _headers file into a static directory (e.g. static/_redirects) and it will be copied to your build directory (e.g. _site/_redirects).

Let's Connect

Keep Reading

Add a Static Directory to an Eleventy Project

Copy static files from a directory into the root of the build directory with Eleventy.

Aug 17, 2020

3 Ways to Render Server-Side Components with Eleventy

While Eleventy doesn't appear to be built for today's component-driven landscape, here are three approaches we can take to get closer.

Jan 10, 2021

WTF is Netlify?

What the what is Netlify and why am I always talking about it?

May 04, 2021