Estoy tratando de crear una aplicación usando tailwindcss y next.js
Comencé a crear la aplicación nextjs, luego ejecuté estos comandos:
npm install -D tailwindcss postcss autoprefixer npx tailwindcss init -pDespués de eso, actualicé tailwind.config.js como:
module.exports = { content: [ "./pages/**/*.{js,ts,jsx,tsx}", "./components/**/*.{js,ts,jsx,tsx}", ], theme: { extend: {}, }, plugins: [], }Y luego creé y rellené ./syles/globals.css con:
@tailwind base; @tailwind components; @tailwind utilities;todo este paso a paso está en el sitio web: https://tailwindcss.com/docs/guides/nextjs pero aún así cualquier intento de personalización no funciona, ¿hay alguna forma de saber si se ha cargado tailwind? ¿Había algo que faltaba por hacer?
Primero importe globals.css en _app.js
import '../styles/globals.css'Además, en lugar de @tailwind, haga lo siguiente para agregar tailwind en globals.css
/* @tailwind base; @tailwind components; @tailwind utilities; */ @import 'tailwindcss/base'; @import 'tailwindcss/components'; @import 'tailwindcss/utilities';