es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Tailwind no se está agregando en mi proyecto de reactjs.

05 Aug, 2023 Programación

Estoy siguiendo el tutorial oficial de instalación de tailwind CSS para reactjs paso a paso, pero tailwindcss no se está agregando a mi proyecto de reactjs.

Este es el enlace al tutorial que estoy siguiendo.

Creo que la única parte donde puedo tener un error es en el archivo tailwind.config.js y aquí está.

module.exports = {
  content: [
    "./src/**/*.{js,jsx,ts,tsx}"
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

index.css

@tailwind base;
@tailwind components;
@tailwind utilities;

postcss.config.js

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
  },
}
Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Primero, asegúrese de haber instalado tailwindcss y postcss como dependencias de desarrollo utilizando npm install tailwindcss postcss autoprefixer.

    Verifique nuevamente que haya seguido todos los pasos en la guía oficial en el orden correcto y que haya agregado @import './index.css'; a su archivo src/index.js.

    Si aún no puede hacer que tailwindcss funcione, intente lo siguiente:

    1. Agregue mode: 'jit' a su archivo tailwind.config.js como la primera línea para habilitar el modo Just-In-Time (JIT).

    2. Intente cambiar su archivo tailwind.config.js a lo siguiente:

    const colors = require('tailwindcss/colors')

module.exports = {
  mode: 'jit',
  purge: [
    './src/**/*.{js,jsx,ts,tsx}',
    './public/index.html',
  ],
  darkMode: false, // o 'media' o 'class'
  theme: {
    extend: {
      colors: {
        gray: colors.trueGray,
        indigo: colors.indigo,
        red: colors.rose,
        yellow: colors.amber,
        green: colors.emerald,
        blue: colors.blue,
      }
    },
  },
  variants: {
    extend: {},
  },
  plugins: [],
}
    1. Intente ejecutar npx tailwindcss -i ./src/index.css -o ./src/tailwind.css en el directorio de su proyecto para omitir la configuración de postcss.

    Si ninguna de estas soluciones funciona, intente pedir ayuda en la página de GitHub de Tailwind CSS o comuníquese con la comunidad de Tailwind CSS para obtener soporte.

Comments are closed.