Eleventy on Netlify

Eleventy (11ty) is a flexible and configurable open source static site generator. Although it’s written in JavaScript, it doesn’t depend on a specific framework for generating or serving content.

# Key features

These features provide important benefits for Eleventy projects, including ones built and deployed with Netlify.

  • JavaScript-friendly. Eleventy was developed as a JavaScript alternative to Jekyll. It’s not dependent on a client-side JavaScript framework or library, which means it doesn‘t predetermine your frontend stack.
  • Flexible config. By default, Eleventy requires no configuration, but it has flexible options for custom setup. It is intentionally decoupled from frameworks, build pipelines, and other tools in order to support your preferences.
  • Adaptable project structure. Eleventy works with your project’s existing directory structure and generates HTML based on the templates, content, and data you provide.
  • Choice of templating. By default, Eleventy uses the template language Liquid. However, it supports many template languages and allows them to be mixed and combined. This allows a project to migrate to or adopt Eleventy gradually over time.

# Netlify integration

When you link a repository for a project, Netlify tries to detect the framework your site is using. If your site is built with Eleventy, Netlify provides a suggested build command and output directory: eleventy and _site. If you’re using the CLI to run Netlify Dev for a local development environment, Netlify also suggests a dev command and port: eleventy --serve and 8080. You can override suggested values or set them in a configuration file instead, but automatic framework detection may help simplify the process of setting up an Eleventy site on Netlify.

For manual configuration, check out the typical build settings for Eleventy.

# More resources