How I Run Eleventy (It’s Complicated?)

Published on Apr 18, 2025, filed under development (feed). (Share this on Mastodon or Bluesky?)

I love Eleventy. I use Eleventy for a few sites. But how I work with Eleventy may not reflect the most usual development and export setup. Here are the two key lines, for Frontend Dogma:

alias fd="cd ~/Projects/frontenddogma.com/; DEBUG=Eleventy* npx @11ty/eleventy --serve --incremental --output=../exports/local/frontenddogma.com/”

alias fdd=”cd ~/Projects/frontenddogma.com/; rm -rf ../exports/local/frontenddogma.com/; DEBUG=Eleventy* npx @11ty/eleventy –incremental –output=../exports/local/frontenddogma.com/; rsync -av –quiet –delete ../exports/local/frontenddogma.com/ ../exports/frontenddogma.com/”

You will be with me on using aliases, I’m sure. But you may wonder about what else is going on. Let me share my thinking—maybe there’s something here that you like, or you can challenge or correct me, which is something I’d like.

• The alias names: “fd” stands for “Frontend Dogma,” and resembles my convention for shortcuts to run projects locally. “fdd” stands for… “Frontend Dogma something,” and I honestly forgot about how I landed on that “d” (which I use for other project exports, too) 😂

• The export folder: I’m choosing one in a parallel folder (“exports,” actually another Git repo), because I like to have the export under version control so that I can review changes and fall back on previous exports, but in a central location with other exports so that it’s easier to exclude exports from editor indexing (which helps performance in WebStorm). This has the added advantage that if the folder history ever becomes too large (whether for me or for GitHub), it’s easy to delete and swap out the repo.

• DEBUG=Eleventy*: This runs Eleventy in debug mode, which I like so as to monitor possible performance bottlenecks. (I also like all the character sequences run through the terminal.)

• --output=../exports/local/frontenddogma.com/: This builds the Eleventy site under a special “local” folder not under version control (but .gitignored). This is a recent change because always deleting Eleventy build folders doesn’t seem necessary; here, in this non-versioned, unindexed parent folder, they do not hurt.

• rm -rf ../exports/local/frontenddogma.com/: On exporting, this deletes anything that was previously built. This is necessary because Eleventy doesn’t (yet?) delete files in the export directory, which would then land in production again.

• rsync -av --quiet --delete ../exports/local/frontenddogma.com/ ../exports/frontenddogma.com/: Also on exporting, this syncs the “local” non-versioned build directory with the versioned directory that hosts the live site. This is a proven setup in that I don’t want to risk temporary development work to go live, and prefer exports to be deliberate, distinct actions. Using rsync is also a recent change, as for a site as large as Frontend Dogma, I suspect it to be faster than moving/copying files, and lighter on SSDs (I won’t die if I err).

In short, the reasons for and benefits of this setup, to me, are:

• Aliases for quick builds and exports
• Debug mode for detailed information on Eleventy activity
• Separate build and export folders to be deliberate about production exports
• A centralized export location that is versioned to compare changes, but easy to exclude from editor indexing

The setup works for me. Please let me know your thoughts, especially if you think I’m missing something. Perhaps I’m making things complicated. Cheers!