0

  1. Installed tailwindcss and tailwindcss/typography plugin with: npm install tailwindcss@latest and npm install -D @tailwindcss/typography.

  2. Installed daisyUI with: npm i daisyui

  3. Created tailwind.config.js manually:

module.exports = {
  content: [],
  theme: {
    extend: {},
  },

  plugins: [require("@tailwindcss/typography"), require(getDaisyUI())],

  daisyui: {
  styled: true,
  themes: true,
  base: true,
  utils: true,
  logs: true,
  rtl: false,
  prefix: "",
  darkTheme: "dark",
  },
}

function getDaisyUI() {
  return "daisyui";
}
  1. Building main.css file with: npx tailwindcss -c tailwind.config.js -i ./static/src/style.css -o ./static/css/main.css

This is the output of stdout:

byt3magic@MacBook-Pro project % npx tailwindcss -c tailwind.config.js -i ./static/src/style.css -o ./static/css/main.css

Rebuilding...

 daisyUI components 2.50.2  https://daisyui.com
  ✔︎ Including:  base, components, 29 themes, utilities
  ❤︎ Support daisyUI:  https://opencollective.com/daisyui 
  

warn - No utility classes were detected in your source files. If this is unexpected, double-check the `content` option in your Tailwind CSS configuration.
warn - https://tailwindcss.com/docs/content-configuration

Done in 428ms.
  1. I checked the main.css file and daisyUI is missing. This is the main.css file that was built: https://pastebin.com/k9AW7sEV

The content of main.css was too large to post here. This paste never expires.

How can I build the css files with daisyUI included?

I tried clearing the npm cache, deleting node_modules folder and reinstalling all packages. I still have the same issue. I didn't get any errors during the building process.

byt3magic
  • 1
  • 2

1 Answers1

0

https://tailwindcss.com/docs/content-configuration

module.exports = {
  content: [
    './pages/**/*.{html,js}',
    './components/**/*.{html,js}',
  ],
  // ...
}

The solution is to define content in tailwind.config.js. Define all the folders where you use files that use tailwind classes.

byt3magic
  • 1
  • 2