A plain starter template for using Tailwind with Sass (without Next, Gatsby, Laravel, etc).
I personally like using Tailwind altogether with Sass because it
makes me able to nest the styles. Also, the @mixin
and
@extend
features really help me to avoid writing the
same styles again and again, so the stylesheet is a bit more
readable.
Use the package manager npm to use this template, or hit the "Use this template" button above.
npm install
npm start
Run the command above, and you are ready to go! To build your website, edit `index.html` to your liking, and style it by editing and/or adding SCSS files in the `sass` folder. Your SCSS files will be automatically processed and outputted to the `css` folder, upon every save.
In development CSS output is not optimized since it will be slow to compress and purge everything on every change.
npm run build
In production, CSS output in the `css` folder will be optimized using Tailwind purging and cssnano compression. Don't forget to update the glob pattern in `purge` option in [tailwind.config.js](https://github.com/mufidu/tailwind-sass-starter/blob/main/tailwind.config.js), if you change folder structure in your project.
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.