A clean and fast Eleventy Starter Project with Vite.
- Eleventy v3.0 + live reload
- Vite v5 as Middleware in Eleventy Dev Server (uses eleventy-plugin-vite)
- Eleventy build output is post-processed by Vite
- CSS post-processing with PostCSS and Autoprefixer
- Tailwind CSS support + @egoist/tailwindcss-icons
- RSS feed 🧡
- XML sitemap
- Great Lighthouse score 💯💯💯💯
Start by generating a new repository based on this project.
After cloning (or downloading) the repository to your local machine, install all dependencies with the command
pnpm install
The project comes with Eleventy’s built-in development server. You can start the server with
pnpm dev
To trigger a production build, use
pnpm build
You'll want to fork this repository and deploy your own Next.js website. Once you have an image generator that sparks joy, you can setup automatic GitHub deployments so that pushing to master will deploy to production! 🚀
You need to add NODE_VERSION
with value 18.17.1
or 20.9.0
on the environment variables setting.
Visit Cloudflare pages docs
for more information.
Example environment variables for the preview branch:
PUBLIC_SITE_URL=${CF_PAGES_URL}
ELEVENTY_PRODUCTION=true
Autoprefixer adds necessary browser prefixes. The browserslist settings can be adjusted in package.json
.
Please provide feedback! 🤗 Ideally by filing an issue here – or via a pull request.
This starter project would not have been possible without the many great sites and projects I was able to learn from, use as inspiration, and shamelessly copy code from:
- Matthias Ott matthiasott/eleventy-plus-vite
- Zach Leatherman zachleat.com
- Max Böck’s Eleventastic
- Stephanie Eckles’s 11ty Netlify Jumpstart
- Miriam Suzanne miriamsuzanne.com
- W3T web3templates.com
This project is open-sourced software licensed under the MIT license.
Copyrights in this project are retained by their contributors. See the license file for more information.
🤫 Psst! If you like my work you can support me via GitHub sponsors.