[SOLVED] Flowbite CSS plugin is not working when including it in tailwind.config.js

Flowbite CSS plugin is not working when including it in tailwind.config.js

I'm using Flowbite (both JS and CSS) in my application. JS was inserted and works (using Webpack and import 'flowbite' in the entry point JS).

For the CSS, I'm using this in the tailwind.config.js file as the documentation tells you to do.

module.exports = {
  content: ['./src/**/*.{html,js}'],
  theme: {
    extend: {}
  },
  plugins: [
    require('flowbite/plugin')
  ]
}

However when compiling everything (npx tailwind build) the CSS doesn't seem to be included in the final CSS file.

I can tell because the FlowBite modal should have a dark background (making everything except the modal darker), but that background does not appear when creating the compiled CSS.

When I do include the flowbite.css manually though, it does render correctly. So the current working solution I have is (in my HTML):

<!-- TODO: Adding the plugin in tailwind.config.js does not work -->
  <link rel="stylesheet" href="https://unpkg.com/flowbite@latest/dist/flowbite.min.css" />

But I'd like to have it compiled automatically from the Tailwind build command.

Solution

Someone in the Discord community answered to me directly. I had to include this:

module.exports = {
  content: ['./src/**/*.html', './node_modules/flowbite/**/*.js'],
  plugins: [
    require('flowbite/plugin')
  ]
}

The './node_modules/flowbite/**/*.js' in content was missing.