Hi guys, setting tailwind in your Vite projects may take two to three steps.
For example in Vite React,
- You need to install the tailwind.
- Generate the config files.
- Add the template to those files.
But I have created an npm package that sets up Tailwind with a single command in your project. It will install the Tailwind, generate the config file, and add the templates to it automatically.
Installation:
npm install -g lazywind
Install the package globally.
then run,
lazywind
run this command in your project directory.
Example:
Now let's set up a React Project using Vite
Setup react,
npm create vite@latest client -- --template react
cd client
npm install
After setting up React and installing the dependencies, you can run the project using:
npm run dev
Set up Tailwind with Lazywind
Hope, you installed lazywind
globally, Now run lazywind
in your project folder, for example, client
is the folder in this case.
It will,
- Install Tailwind CSS
- Generate the tailwind.config.js and postcss.config.js files
- Add the necessary templates.
That's it, with just a single command.
Package link: https://www.npmjs.com/package/lazywind
Your Tailwind setup is now complete. Test it out and let me know your feedback - I'd love to hear it!
Top comments (0)