Ignite UI for Angular Habilidades de Agente

    Ignite UI for Angular incluye Agent Skills: archivos de conocimiento estructurado que enseñan a los asistentes de programación de IA (GitHub Copilot, Cursor, Windsurf, Claude, Gemini CLI, JetBrains Junie, etc.) cómo trabajar con Ignite UI for Angular. Estos archivos de habilidades proporcionan orientación contextual sobre componentes, cuadrículas, operaciones de datos y tematización, permitiendo que tu asistente de IA genere código preciso e idiomático que siga las mejores prácticas.

    Note

    El panorama de las herramientas de IA está evolucionando rápidamente. Las ubicaciones de descubrimiento de habilidades y las opciones de distribución pueden cambiar a medida que se actualicen herramientas e IDEs. Consulta siempre la documentación oficial de tu herramienta o agente específico para obtener la información más reciente.

    Available Skills

    Los archivos de habilidades están en elskills/ directorio del repositorio de Ignite UI for Angular:

    Skill Camino Descripción
    Componentes y disposición skills/igniteui-angular-components/SKILL.md Componentes independientes, controles de formulario, superposiciones, diseño
    Data Grids skills/igniteui-angular-grids/SKILL.md Cuadrícula, Grid de árbol, Grid jerárquica, Pivot Grid, ordenación, filtrado, agrupación, paginación, datos remotos
    Tematización y estilismo skills/igniteui-angular-theming/SKILL.md Paletas, tipografía, elevaciones, temas componentes, servidor MCP
    Note

    A partir de Ignite UI for Angular 21.1.0, estas habilidades se descubren automáticamente al colocarse en la ruta de habilidades de tu agente (por ejemplo, ,.claude/skills,.agents/skills,)..cursor/rules/ Esta versión incluye una migración opcional para añadir estas habilidades automáticamente a tu proyecto.

    Skill Locations

    Cada herramienta de codificación con IA descubre habilidades a partir de directorios específicos. Coloca tus archivos de habilidades en la ubicación adecuada para que tu asistente de IA pueda encontrarlos y usarlos automáticamente. La convención general.agents/skills/ se soporta en múltiples herramientas, y cada herramienta también tiene sus propios directorios específicos.

    General (.agents/skills/)

    El.agents/skills/ directorio es una convención cross-agent soportada por múltiples herramientas, incluyendo VS Code con Copilot, OpenAI Codex, Cursor, Gemini CLI, Antigravity y Windsurf. Copia los directorios de habilidades en.agents/skills/ la raíz de tu proyecto:

    .agents/
      skills/
        igniteui-angular-components/
          SKILL.md
        igniteui-angular-grids/
          SKILL.md
        igniteui-angular-theming/
          SKILL.md
    

    Para las habilidades a nivel de usuario (globales) disponibles en todos los proyectos, utiliza~/.agents/skills/ en su lugar.

    GitHub Copilot

    GitHub Copilot descubre habilidades de:

    Scope Ubicación
    Proyecto .github/skills/, .claude/skills/
    Vida personal ~/.copilot/skills/,~/.claude/skills/ (Solo agente de codificación de Copilot y solo CLI de GitHub Copilot)

    Propina: En VS Code, estas ubicaciones también incluyen el general.agents/skills/ y~/.agents/skills/ puedes configurar ubicaciones adicionales de habilidades usando elchat.agentSkillsLocations escenario.

    Claude

    Claude descubre habilidades de:

    Scope Ubicación
    Proyecto .claude/skills/
    Vida personal ~/.claude/skills/

    Cursor

    Cursor descubre habilidades de:

    Scope Ubicación
    Proyecto .agents/skills/, .cursor/skills/
    User (global) ~/.cursor/skills/

    Gemini CLI and Antigravity

    Gemini CLI and Antigravity discover skills from:

    Scope Ubicación
    Workspace .gemini/skills/, .agents/skills/
    User ~/.gemini/skills/, ~/.agents/skills/

    Propina: Utiliza el/skills comando barra en la CLI Gemini para ver y gestionar las habilidades instaladas.

    Junie (JetBrains IDEs)

    Junie descubre habilidades de:

    Scope Ubicación
    Proyecto .junie/skills/
    User ~/.junie/skills/

    Windsurf

    El windsurf aprende habilidades de:

    Scope Ubicación
    Workspace .windsurf/skills/, .agents/skills/
    Global ~/.codeium/windsurf/skills/, ~/.agents/skills/

    Installing Skills

    Utiliza una de las opciones de abajo para descargar y colocar los archivos de habilidades en la ubicación adecuada para tu asistente de IA.

    Option A - Use the Ignite UI CLI

    Elai-config comando copia los archivos skill del paquete de Ignite UI for Angular instalado y.claude/skills/ escribe.vscode/mcp.json la configuración Ignite UI del servidor MCP. Si los archivos ya existen y están actualizados, el comando es un no-op.

    Uso de esquemas Angular:

    ng generate @igniteui/angular-schematics:ai-config
    

    Esto también registra el@angular/cli servidor MCP junto.vscode/mcp.json a los servidores Ignite UI.

    Usando la Ignite UI CLI:

    Option A - Use the Ignite UI CLI

    Elai-config comando copia los archivos skill del paquete de Ignite UI for Angular instalado y.claude/skills/ escribe.vscode/mcp.json la configuración Ignite UI del servidor MCP. Si los archivos ya existen y están actualizados, el comando es un no-op.

    Uso de esquemas Angular:

    ng generate @igniteui/angular-schematics:ai-config
    
    If Ignite UI for Angular is already installed in your project, the skill files are available under `node_modules`. To copy them into your project (e.g. into `.agents/skills/`), run:
    
    **macOS / Linux / Windows (PowerShell)**
    
    ```bash
    cp -r node_modules/igniteui-angular/skills/. .agents/skills/
    

    Windows (Símbolo del prompt)

    robocopy node_modules\igniteui-angular\skills .agents\skills /E
    

    O copiar directorios de habilidades individuales según sea necesario:

    macOS / Linux / Windows (PowerShell)

    cp -r node_modules/igniteui-angular/skills/igniteui-angular-components .agents/skills/
    cp -r node_modules/igniteui-angular/skills/igniteui-angular-grids .agents/skills/
    cp -r node_modules/igniteui-angular/skills/igniteui-angular-theming .agents/skills/
    

    Windows (Símbolo del prompt)

    robocopy node_modules\igniteui-angular\skills\igniteui-angular-components .agents\skills\igniteui-angular-components /E
    robocopy node_modules\igniteui-angular\skills\igniteui-angular-grids .agents\skills\igniteui-angular-grids /E
    robocopy node_modules\igniteui-angular\skills\igniteui-angular-theming .agents\skills\igniteui-angular-theming /E
    

    Option C - Use the gemini skills CLI

    Elgemini skills install comando instala habilidades directamente desde un repositorio Git. Soporta dos ámbitos:

    • Alcance de usuario (por defecto): instala habilidades globalmente para tu cuenta de usuario, haciéndolas disponibles en todos los proyectos. Las habilidades se colocan en~/.gemini/skills/ o~/.agents/skills/.
    • Alcance de espacio de trabajo: instala habilidades localmente en el directorio actual del proyecto,.agents/skills/ asignándolas solo a ese proyecto.

    Instalar en el ámbito de usuario (por defecto):

    gemini skills install https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-components
    gemini skills install https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-grids
    gemini skills install https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-theming
    

    Instalar en el ámbito del espacio de trabajo:

    gemini skills install --scope workspace https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-components
    gemini skills install --scope workspace https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-grids
    gemini skills install --scope workspace https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-theming
    

    Una vez instalados, los archivos de habilidades están disponibles en la ubicación correspondiente y serán descubiertos automáticamente por asistentes de IA compatibles.

    Option D - Use the npx skills CLI

    Laskills CLI es una herramienta interactiva que descarga e instala habilidades directamente en tu proyecto. Ejecuta el siguiente comando en la raíz de tu proyecto:

    npx skills add IgniteUI/igniteui-angular
    

    La CLI te guiará a través de una serie de indicaciones para:

    1. Selecciona qué habilidades instalar (componentes, tematización, etc.).
    2. Elige la ubicación objetivo para los archivos de habilidades en tu proyecto (por ejemplo.agents/skills/, )..github/skills/
    3. Descarga y escribe automáticamente los archivos de habilidades seleccionados.

    Una vez completadas, las habilidades están listas para usar, sin necesidad de copiar manualmente el archivo.

    Nota: Requiere Node.js y conexión a internet. El comando obtiene los archivos de habilidades más recientes del repositorio IgniteUI/igniteui-angular.


    Theming MCP Server

    La habilidad de Temización incluye instrucciones de configuración para eligniteui-theming servidor MCP, que da a los asistentes de IA acceso a herramientas de tematización en vivo como la generación de paletas y el andamiaje de temas componentes. Consulta el archivo de habilidades Theming para los pasos de configuración de los IDEs de VS Code, Cursor, Claude Desktop y JetBrains.

    Para más información sobre el Theming MCP, consulte la documentación Ignite UI Theming MCP.

    Additional Resources

    Nuestra comunidad es activa y siempre da la bienvenida a nuevas ideas.