packages/docs/src/routes/(routes)/docs/install/postcss/+page.md
Initialize a new Node project in the current directory using npm init -y if it's not a Node project already.
Install PostCSS, Tailwind CSS, and daisyUI
npm i postcss postcss-cli tailwindcss @tailwindcss/postcss daisyui@latest
Create a postcss.config.mjs file and add Tailwind CSS to it
const config = {
plugins: {
'@tailwindcss/postcss': {},
},
};
export default config;
Add Tailwind CSS and daisyUI to your CSS file.
Address your HTML and other markup files in the source function.
@import "tailwindcss";
@plugin "daisyui";
Add a script to your package.json to build the CSS.
{
"scripts": {
"build:css": "postcss app.css -o public/output.css"
},
}
Run the script to build the CSS file
npm run build:css
This command creates a public/output.css file with the compiled CSS. You can link this file to your HTML file.
<link href="./output.css" rel="stylesheet">
Now you can use daisyUI class names!