The Eleventy starter kit

What is it ?

This is a minimalist, ready to use Eleventy starter project that embarks Tailwind, PostCSS (nesting, imports, media queries, minify), Fontawesome Icons, Webpack, Typescript and Vite


Clone the repository

Clone the Github project repo

  $ git clone git@github.com:4lador/11ty-tailscript.git

CD to the project folder

  $ cd 11ty-tailscript

Install project libraries

This project is using Yarn as package manager, if you would like to use npm you only need to delete yarn.lock and install with npm

  $ yarn install

Install entr Linux executable

This project features a workaround to fix an issue with webc nested components not being able to reload themselves when edited on Eleventy. This workaround involve entr Linux / MacOS tool to be able to refresh the page when you edit a nested component. If you are a Windows user, you should remove the workaround by deleting this line on the package.json scripts section: "watch:11ty-nested-webc-fix" .

If you are a Linux or MacOS user, you should download entr

Debian based

  $ sudo apt install entr

Archlinux flavour

  $ sudo pacman -S entr



Launch the dev server and start development using Vite

  $ yarn run start


When ready for production release just build the project with

  $ yarn run build

Rename project prefixes

If you want to rename component file names prefixes and linked tags in webc files, you can do it quickly that way

  $ yarn run rename-project-prefix tailscript

Where the first argument is the old prefix (tailscript by default) and the 2nd argument is your new prefix


If you would like to contribute to add features or maybe fix an eventual bug that you found, you're welcome and I thanks you

Fork the repository

Fork the project on Github

CD to the project folder

  $ cd 11ty-tailscript

Create a new branch

  $ git checkout -b <branch-name>

Making and pushing changes

  $ git add .
git commit -m "a short description of the changes"

Make a pull request

Head on over the Github project, then you will see a banner indicating that your branch is ahead of the main project branch. Click on contribute and then Open a pull request

More informations

If you need more informations about Github projects contributions you can check this page on Github Docs