Eleventy Excellent 3.0

It’s been a few months, and I have decided to change things again, which probably makes the starter even more opinionated 🤷. For those who prefer the previous version, Version 2 will remain accessible in its own branch.

Core changes:

  • ESM! I originally wanted to wait for the beta version of Eleventy 3.0, but the alpha version works absolutely fine, so I decided to go for it.
  • a new font for the body (base) text: Inclusive Sans. Only has Regular 400 and Regular 400 italic for now, so bold uses the display font.
  • A new config structure (turns out I am the Eleventy config person!). I also decided to have everything inside the src folder. More about that in the docs.
  • some new filters, for having markdown format in the frontmatter, and for sorting.
  • there is now a “setup” directory inside of the _config folder, for automatic favicon creation and to add the screenshots to the “built with” section. They are triggered by new scripts in package.json. See also “Favicons” in the docs.
  • SVGs are now in src/assets/svg, and there is a new SVG shortcode to include them. I also explain this in the SVG section.
  • I now actively use Eleventy’s plugins WebC (for components), the bundle plugin and<is-land>.
  • I made small CSS changes everywhere - and introduce a new structure, also explained in the docs.
  • JavaScript handling changed a lot, too.
  • Also: improvements in terms of organization and naming.

I don’t consider myself a JavaScript person, and I still struggle to fully grasp WebC. So, if you have any suggestions or improvements, in particular to the WebC and web components code, please don’t hesitate to reach out or send a PR.

Plans for the future:
This starter was meant to be hosted on Netlify, and I’d like to change that so that it works with any host without much extra effort.

I hope you enjoy the new version! 🌟
And, should you decide to upgrade – sorry for not making this easier for you. I hope that you don’t face too many difficulties!


View this page on GitHub.