Next Ui Tailwind Custom Prefix

57 Views Asked by At

How can I apply custom PREFIX to Next UI library alongside Tailwind CSS? While it works seamlessly with Tailwind CSS, the issue arises with Next UI components as they use regular classes without a prefix. Is there a way to make Next UI components use the "tw-" prefix in their CSS, as defined in my tailwind.config.js file?

   const { nextui } = require("@nextui-org/react");

module.exports = {
  prefix: "tw-",
  important: true,
  content: ["./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}"],
  presets: [],
  darkMode: "class", // or 'media'
  theme: {},
  plugins: [
    require("@tailwindcss/typography"),
    require("@tailwindcss/line-clamp"),
    nextui({
      prefix: "tw-",
    }),
  ],
  corePlugins: {
    preflight: false,
  },
};
0

There are 0 best solutions below