Communitygithub.com

papopporking-oss/opencode-nextjs-standard

Instrucciones de instalación para daisyUI 5

¿Qué es opencode-nextjs-standard?

Esta habilidad guía a los desarrolladores a través del proceso de instalación de daisyUI 5, una biblioteca de componentes CSS para Tailwind CSS 4. Es especialmente útil para quienes construyen aplicaciones Next.js, pero también es compatible con una amplia gama de frameworks y herramientas como Angular, Astro, Vue, Laravel, SvelteKit y más. La habilidad explica cómo configurar daisyUI 5 tanto con Node.js (usando el comando 'npm i -D daisyui@latest' y la directiva '@plugin "daisyui";') como a través de CDN para configuraciones que no requieren instalación. También cubre aspectos importantes como la obsolescencia de 'tailwind.config.js' en Tailwind CSS v4 y proporciona enlaces a guías de instalación específicas para cada framework.

Compatible con~Claude Code~Codex CLI~Cursor✓OpenCode
npx skills add https://github.com/papopporking-oss/opencode-nextjs-standard/tree/HEAD/.agents/skills/daisyui/install

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

Instalar daisyUI 5

Guía de instalación

  1. Debes usar Tailwind CSS 4 con daisyUI 5.
  2. El archivo tailwind.config.js está obsoleto en Tailwind CSS v4. No uses tailwind.config.js. Si Tailwind CSS v4 es una dependencia de Node.js, agrega solo @import "tailwindcss"; al archivo CSS.
  3. Para instalar daisyUI 5, ejecuta npm i -D daisyui@latest. Luego, agrega @plugin "daisyui"; al archivo CSS.
  4. Instala daisyUI como dependencia cuando sea posible. Si tienes una razón específica para usar un CDN, usa los archivos CDN de Tailwind CSS y daisyUI:
<link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
  1. Si Tailwind CSS y daisyUI son dependencias de Node.js, usa este archivo CSS:
@import "tailwindcss";
@plugin "daisyui";

CDN

Para una configuración en el navegador sin instalación, carga el CSS precompilado de daisyUI y la compilación del navegador de Tailwind:

<link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>

El archivo CDN principal incluye los temas claro y oscuro. Para cargar todos los temas integrados, usa:

<link href="https://cdn.jsdelivr.net/npm/daisyui@5/themes.css" rel="stylesheet" type="text/css" />

También puedes combinar módulos CSS de daisyUI por separado desde el CDN. Los archivos CDN no incluyen las variantes is-drawer-open: y is-drawer-close:.

Configuración independiente y específica del framework

Usa las rutas de archivo y los pasos de integración de la guía seleccionada. Cada framework puede usar un punto de entrada CSS diferente.

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

Skills relacionados