Adicionando Tailwind no Docusaurus | Docusaurus

• Adicionando Tailwind no Docusaurus | Docusaurus

Instale as dependências

npm i --save-dev tailwindcss postcss @tailwindcss/postcss 

Crie o arquivo no seguinte caminho src/plugins/tailwind-config.js

module.exports = function tailwindPlugin(context, options) {
  return {
    name: "tailwind-plugin",
    configurePostCss(postcssOptions) {
      postcssOptions.plugins = [require("@tailwindcss/postcss")];
      return postcssOptions;
    },
  };
};

Adicione o plugin nas configurações do Docusaurus - docusaurus.config.ts

const config: Config = {
  //...
  plugins: ["./src/plugins/tailwind-config.js"],
  //...
};

Adicione o Tailwind no css base - src/css/custom.css

@import "tailwindcss";

@custom-variant dark (&:is([data-theme="dark"] *));