Desarrollo con IA | Neural Native

Empieza por la skill; añade MCP si lo necesitas

Neural AI ayuda a los agentes de programación a trabajar con las APIs publicadas de Neural. La skill neural-native aporta instrucciones, referencias y ejemplos para esta biblioteca. Puedes empezar instalando solo la skill.

El MCP local opcional permite a un agente compatible descubrir componentes, consultar contratos, obtener ejemplos y detectar errores habituales de uso. Sus catálogos Web y Native están separados; la skill no depende de este servidor.

Utiliza versiones compatibles

Esta guía utiliza neural-native 0.1.0 con @neural-ui/native 0.1.0-beta.2 y Angular 22.2.2. Su base de Angular Native es 0.18.2.

MCP 0.2.1 incluye Web Core 2.0.3 y Native 0.1.0-beta.2. Requiere Node 22.22.3 o posterior. Indica library native y version 0.1.0-beta.2 de forma explícita al llamar a las herramientas.

Comprueba primero package.json y el lockfile de tu aplicación. Para Core 2.0.1, conserva la skill Web 0.1.0 y MCP 0.2.0 hasta que decidas actualizar la aplicación. Una versión incompatible produce un error; no se convierte en otra automáticamente.

Terminal

node --version
npm ls @neural-ui/native @ng-native/core @ng-native/components

Versiones y compatibilidad

Instala la skill en Codex

Desde la carpeta de tu aplicación, ejecuta el comando con Node y npm disponibles. Instala la skill completa desde una release fijada de GitHub en .agents/skills/neural-native; no instala el paquete de componentes Neural.

Conserva las referencias y los ejemplos junto a SKILL.md. Si la skill no aparece, inicia una nueva sesión de Codex e invócala con $neural-native. Revisa una instalación existente antes de sustituirla.

Terminal · Codex

npx --yes skills@1.7.2 add https://github.com/PedroMorenoTrujillo/neural-ai/tree/neural-native-v0.1.0/skills/neural-native --skill neural-native --agent codex --copy --yes

Documentación de skills de Codex

Instala la skill en Claude Code

Para Claude Code, utiliza este comando. La skill se copia en .claude/skills/neural-native. Invoca /neural-native junto con tu petición. Puedes instalarla para ambos agentes si utilizas los dos.

Las skills tienen licencia MIT y no requieren cuenta ni clave de API de Neural. Tu agente de programación mantiene sus propios requisitos de instalación, acceso y uso.

Terminal · Claude Code

npx --yes skills@1.7.2 add https://github.com/PedroMorenoTrujillo/neural-ai/tree/neural-native-v0.1.0/skills/neural-native --skill neural-native --agent claude-code --copy --yes

Documentación de skills de Claude Code

Dale al agente una tarea concreta

Indica la biblioteca, la versión instalada, la interacción que necesitas y su resultado esperado. Pide que consulte los contratos públicos instalados antes de escribir los bindings. El ejemplo usa Codex; en Claude Code, cambia $neural-native por /neural-native.

La skill orienta el trabajo, pero no aplica cambios por sí sola. Revisa los cambios que proponga el agente y deja que compile y pruebe la aplicación.

Petición

Usa $neural-native con @neural-ui/native@0.1.0-beta.2.
Crea un componente Angular standalone con un botón Guardar y un signal
que muestre una confirmación al activarlo. Consulta primero el import
y el output públicos de NeuButtonComponent. Utiliza controles Native y (pressed), no botones del DOM web.
Compila el componente y prueba la interacción.

Conecta el servidor MCP opcional

Elige la línea correspondiente a tu agente. La configuración de Codex es de usuario por defecto; el comando de Claude Code utiliza explícitamente el ámbito del proyecto y crea o actualiza .mcp.json. Revisa la configuración existente antes de añadir otro servidor con el mismo nombre. El cliente inicia el proceso local stdio al conectarse.

La primera descarga necesita acceso a npm. Durante su ejecución, este servidor utiliza referencias empaquetadas, no hace peticiones de red ni lee o escribe los archivos de tu proyecto. Requiere un cliente MCP compatible; no es una URL HTTP ni un conector para ChatGPT web.

Terminal · MCP

codex mcp add neural-ui -- npx --yes neural-ui-mcp@0.2.1
claude mcp add --transport stdio --scope project neural-ui -- npx --yes neural-ui-mcp@0.2.1

Consulta el contrato real de Button

Pide a tu agente que llame a get_api con estos argumentos. Son argumentos de una herramienta, no un comando de terminal. La respuesta contiene el selector, los inputs y los outputs públicos de NeuButtonComponent.

Button de Native utiliza label y emite pressed. No reutilices el selector web button[neu-button] ni su output neuClick. Utiliza list_components para descubrir otro componente, search_documentation para consultar las guías y get_example para obtener un ejemplo completo empaquetado.

get_api · arguments.json

{
  "library": "native",
  "version": "0.1.0-beta.2",
  "entrypoint": "@neural-ui/native/button",
  "symbol": "NeuButtonComponent"
}

Detecta un binding incorrecto

Este ejemplo contiene a propósito un output incorrecto. Pide al agente que envíe el código completo en source a validate_usage, con library native, version 0.1.0-beta.2 y filename ai-example.ts. Debe devolver valid: false e indicar que el output click no existe.

El servidor no modifica el código. Pide al agente que aplique el output documentado por get_api y vuelva a ejecutar validate_usage.

ai-example.ts

import { Component, signal } from '@angular/core';
import { View, Text } from '@ng-native/components';
import { NeuButtonComponent } from '@neural-ui/native/button';

@Component({
  selector: 'app-ai-example',
  imports: [View, Text, NeuButtonComponent],
  template: `
    <view [style]="{ padding: 24, gap: 16 }">
      <neu-button label="Guardar" (click)="save()" />
      <text>{{ status() }}</text>
    </view>
  `,
})
export class AiExample {
  readonly status = signal('Sin cambios guardados');

  save(): void {
    this.status.set('Cambios guardados en este ejemplo');
  }
}

Aplica la corrección y pruébala

El componente standalone corregido actualiza el signal de confirmación al activar Guardar. Este ejemplo solo cambia estado local. Vuelve a validar el código completo; valid: true significa que el validador estático no ha encontrado errores dentro de su alcance.

Móntalo en tu aplicación Angular Native, compílalo y prueba el botón en iOS y Android. Sigue la guía de testing para las comprobaciones de plataforma.

ai-example.ts

import { Component, signal } from '@angular/core';
import { View, Text } from '@ng-native/components';
import { NeuButtonComponent } from '@neural-ui/native/button';

@Component({
  selector: 'app-ai-example',
  imports: [View, Text, NeuButtonComponent],
  template: `
    <view [style]="{ padding: 24, gap: 16 }">
      <neu-button label="Guardar" (pressed)="save()" />
      <text>{{ status() }}</text>
    </view>
  `,
})
export class AiExample {
  readonly status = signal('Sin cambios guardados');

  save(): void {
    this.status.set('Cambios guardados en este ejemplo');
  }
}

Qué comprueba el validador

validate_usage comprueba imports, símbolos públicos, templates inline literales, inputs y outputs conocidos, inputs obligatorios y conflictos de propiedad del formulario. No ejecuta el código ni resuelve la aplicación Angular completa.

No verifica los tipos de las expresiones, los templates externos ni el ámbito de imports de los componentes. Tampoco comprueba el diseño, la accesibilidad ni el comportamiento en dispositivos. compilationChecked siempre es false. Mantén la compilación Angular, los tests y las pruebas de interacción en tu flujo.

Resuelve problemas de configuración

La skill no aparece: comprueba que la carpeta neural-native está completa en el directorio de skills de tu agente, evita instalaciones duplicadas e inicia una nueva sesión.

El MCP no arranca: comprueba node --version, el acceso a npm en la primera ejecución y el estado MCP del cliente. Si ejecutas npx solo, el proceso espera mensajes del protocolo; conéctalo desde el cliente.

Versión incompatible: compara el paquete instalado con la versión de esta guía y elige la release correspondiente de la skill y del MCP. No cambies dependencias de la aplicación solo para ocultar el error.

Código y releases de Neural AI