Eleventy Plus Vite. Rien n’est plus vite.
A simple, fast – and a little bit opinionated – starter project for Eleventy.
By Matthias Ott.
Code on Github
- Eleventy 2.0.0-canary
- New Eleventy 2.0 Dev Server with live reload
- Vite 3.0 as Middleware in Eleventy Dev Server (uses eleventy-plugin-vite)
- Eleventy build output is post-processed by Vite (with Rollup)
- CSS/Sass post-processing with PostCSS incl. Autoprefixer and cssnano
- Uses my own opinionated CSS/Sass structure
- Critical CSS, generated and inlined via rollup-plugin-critical. The main CSS file is then loaded asynchronously with Scott Jehl’s
medialoading strategy (adds
media="print"and swaps to
- Example implementation of a web font loading strategy (critical FOFT with preload)
- Basic fluid typography based on Utopia
- Basic dark mode support (using
prefers-color-schemeand CSS Custom Properties)
- Polyfill for focus-visible
- RSS feed 🧡
- XML sitemap
- Four Hundos Lighthouse score 💯💯💯💯