After migration flowbite-react is not working

I migrated from version 0.11 to 0.12. Following the steps, I managed to fix everything except for flowbite-react. I'm not sure if the issue lies with the library or my migration process, so I'll explain the whole process. First, I added Tailwind CSS by creating

tailwind.config.cjs

tailwind.config.cjs

and

postcss.config.cjs

postcss.config.cjs

files. After that, I imported Tailwind CSS into the CSS file and enabled Tailwind to work.

Following the documentation for installing dependencies, I installed flowbite-react with the command

npm install -D flowbite-react

npm install -D flowbite-react

. Then, I added the flowbite plugin to

tailwind.config.cjs

tailwind.config.cjs

so it looks like this:

const { resolveProjectPath } = require('wasp/dev');

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    resolveProjectPath('./src/**/*.{js,jsx,ts,tsx}'),
    'node_modules/flowbite-react/lib/esm/**/*.js',
  ],
  theme: {
    extend: {},
  },
  plugins: [require('flowbite/plugin')],
};

const { resolveProjectPath } = require('wasp/dev');

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    resolveProjectPath('./src/**/*.{js,jsx,ts,tsx}'),
    'node_modules/flowbite-react/lib/esm/**/*.js',
  ],
  theme: {
    extend: {},
  },
  plugins: [require('flowbite/plugin')],
};

after

wasp start

wasp start

it is not working. I have attached example of Navbar how it looks after migration and how it was looking on version 0.11.

I have tried installing

npm i autoprefixer postcss tailwindcss flowbite

npm i autoprefixer postcss tailwindcss flowbite

, installing flowbite-react as non dev dependency but none of that works.

I have created side React project with Vite to make sure i have installed flowbite-react properly on non Wasp project following flowbite-react documentation.

Do you have any suggestions how can I fix this? All of my components are made of flowbite-react components.

After migration flowbite-react is not working

tailwind.config.cjs

tailwind.config.cjs

and

postcss.config.cjs

postcss.config.cjs

files. After that, I imported Tailwind CSS into the CSS file and enabled Tailwind to work.

Following the documentation for installing dependencies, I installed flowbite-react with the command

npm install -D flowbite-react

npm install -D flowbite-react

. Then, I added the flowbite plugin to

tailwind.config.cjs

tailwind.config.cjs

so it looks like this:

const { resolveProjectPath } = require('wasp/dev');

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    resolveProjectPath('./src/**/*.{js,jsx,ts,tsx}'),
    'node_modules/flowbite-react/lib/esm/**/*.js',
  ],
  theme: {
    extend: {},
  },
  plugins: [require('flowbite/plugin')],
};

const { resolveProjectPath } = require('wasp/dev');

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    resolveProjectPath('./src/**/*.{js,jsx,ts,tsx}'),
    'node_modules/flowbite-react/lib/esm/**/*.js',
  ],
  theme: {
    extend: {},
  },
  plugins: [require('flowbite/plugin')],
};

after

wasp start

wasp start

it is not working. I have attached example of Navbar how it looks after migration and how it was looking on version 0.11.

I have tried installing

npm i autoprefixer postcss tailwindcss flowbite

npm i autoprefixer postcss tailwindcss flowbite

After migration flowbite-react is not working

Similar Threads

After migration flowbite-react is not working

Similar Threads

Similar Threads

Similar Threads