Avoiding Hallucinations When Building Angular Apps with Gemini CLI

Previene alucinaciones en aplicaciones Angular utilizando Gemini CLI. Aprende cómo mantener la estabilidad de tus apps con esta herramienta útil.

23 dic 2025 • 4 min de lectura • Equip Q2BSTUDIO

Preventing Hallucinations in Angular Apps Using Gemini CLI

En proyectos Angular actuales la cadencia de versiones y modelos de lenguaje puede ser rápida, pero eso no garantiza que un modelo esté entrenado con la documentación más reciente. GeminiCLI acelera el desarrollo con IA, pero también puede producir hallucinations o código desactualizado si no se le da el contexto correcto.

Para reducir errores y alinearlo con buenas prácticas de Angular y TypeScript se recomiendan varias técnicas: definir un prompt global, exponer recursos oficiales y conectar GeminiCLI al MCP de Angular. Estas medidas ayudan a generar código más preciso, mantenible y seguro, especialmente cuando se trabaja en aplicaciones a medida y software a medida para clientes exigentes.

Prompt con buenas prácticas: mantén un prompt compartido en Gemini.md o crea un comando slash personalizado que se incluya en cada petición. Por ejemplo indica que el asistente es experta en TypeScript, Angular y desarrollo de aplicaciones escalables; que produzca código funcional, mantenible, performant y accesible siguiendo las mejores prácticas. Entre las directrices concretas incluye TypeScript con comprobación estricta y preferencia por inferencia de tipos; evitar any y usar unknown cuando corresponda. En Angular priorizar componentes standalone sobre NgModules; no establecer standalone true dentro de decoradores en Angular v20 y superiores; usar signals para el estado; implementar lazy loading para rutas de características; reemplazar HostBinding y HostListener por el objeto host en @Component o @Directive; usar NgOptimizedImage para imágenes estáticas y recordar que no funciona con imágenes inline en base64.

Requisitos de accesibilidad: pasar todas las comprobaciones AXE y cumplir como mínimo WCAG AA, controlando foco, contraste de color y atributos ARIA adecuados. Componentes: mantenerlos pequeños y con una sola responsabilidad; usar input() y output() como funciones en lugar de decoradores cuando aplique; usar computed() para estado derivado; establecer changeDetection ChangeDetectionStrategy.OnPush en el decorador @Component; preferir plantillas inline para componentes pequeños; preferir formularios reactivos; evitar ngClass y ngStyle usando bindings class y style; y usar rutas relativas al fichero TypeScript del componente para plantillas y estilos externos.

Estado y plantillas: para estado local preferir signals y computed para estado derivado; mantener transformaciones puras y predecibles; evitar mutate sobre signals y usar update o set. En plantillas mantener la lógica simple, preferir control de flujo nativo @if @for @switch en lugar de *ngIf *ngFor *ngSwitch; usar el async pipe para observables; no asumir globals como new Date() ni colocar funciones flecha en plantillas.

Servicios: diseñar servicios con una única responsabilidad; usar providedIn root para singletons; preferir inject() sobre la inyección por constructor cuando convenga. Esta estrategia de reglas en el prompt te da control total sobre cómo quieres que el modelo genere código, aunque implica mantener ese archivo actualizado conforme Angular evoluciona.

llms.txt y llms-full.txt: otra aproximación es exponer un llms.txt ligero que enlace a recursos clave y un llms-full.txt más completo que explique cómo funciona Angular y cómo construir aplicaciones. Esto permite que modelos descubran documentación oficial sin necesidad de una infraestructura compleja, aunque introduces dependencia en la disponibilidad y precisión de esa fuente externa.

Angular MCP y GeminiCLI: la Angular CLI incluye un MCP que GeminiCLI puede consumir para acceder a documentación y recomendaciones actualizadas. Añadir en el fichero .gemini/settings.json una entrada mcpServers con un servidor angular-cli que ejecute npx -y @angular/cli mcp permite a GeminiCLI acceder a herramientas como ai_tutor para tutoría interactiva; find_examples para ejemplos autorizados; get_best_practices con la guía de mejores prácticas; list_projects leyendo angular.json; onpush_zoneless_migration para planes de migración a OnPush; y search_documentation para buscar en angular.dev APIs y guías. Un ejemplo de configuración simplificada podría verse así: { mcpServers: { angular-cli: { command: npx, args: [-y, @angular/cli, mcp] } } } Este enfoque es robusto y requiere poco setup, proporcionando contexto oficial que reduce significativamente las probabilidades de hallucinations.

Cómo aplicarlo en tu organización: combina un prompt con directrices claras, un llms.txt público si controlas la documentación del proyecto y la integración del MCP para obtener ejemplos y guías oficiales. Además valida automáticamente el código generado con pruebas, linters y checks de accesibilidad para atrapar regresiones.

En Q2BSTUDIO como empresa de desarrollo de software y aplicaciones a medida ofrecemos experiencia práctica para integrar estas soluciones en workflows reales. Podemos ayudarte a implementar pipelines que unan GeminiCLI con prácticas de CI/CD, pruebas automatizadas y controles de calidad, todo orientado a proyectos de software a medida y aplicaciones a medida. Si tu proyecto requiere capacidades de inteligencia artificial, agentes IA o soluciones de ia para empresas contamos con servicios especializados; descubre nuestros servicios de desarrollo de aplicaciones a medida y nuestras soluciones de inteligencia artificial para empresas.

También ofrecemos experiencia en ciberseguridad y pentesting para proteger la cadena de suministro de software, servicios cloud aws y azure, y servicios de inteligencia de negocio con Power BI para convertir datos en decisiones accionables. Palabras clave importantes para tu visibilidad incluyen aplicaciones a medida, software a medida, inteligencia artificial, ciberseguridad, servicios cloud aws y azure, servicios inteligencia de negocio, ia para empresas, agentes IA y power bi.

Resumen: GeminiCLI es una herramienta potente si se le da contexto actualizado. Usa prompts con buenas prácticas, aprovecha llms.txt cuando sea posible y conecta el MCP de Angular para minimizar hallucinations. Si necesitas apoyo para integrar estas prácticas, modernizar tu stack Angular o desarrollar aplicaciones a medida seguras y escalables, en Q2BSTUDIO podemos acompañarte en todo el proceso.

UNA PAUSA?

Juga una estona abans de marxar

ELS NOSTRES SERVEIS

Com et podem ajudar

Intel·ligència artificial

Agents d'IA, chatbots i assistents intel·ligents que automatitzen tasques i atenen els teus clients 24/7 per millorar l'eficiència del teu negoci.

Més info

Desenvolupament de programari

Aplicacions web, mòbils i d'escriptori, intranets, e-commerce, SaaS i plataformes de gestió dissenyades per a les necessitats concretes de la teva empresa.

Més info

Serveis cloud

Migració, infraestructura, hosting gestionat, alta disponibilitat i seguretat en Microsoft Azure i Amazon Web Services perquè el teu negoci escali sense límits.

Més info

Ciberseguretat i pentesting

Auditories de seguretat, test d'intrusió (pentesting) i protecció d'aplicacions, dades i infraestructura on-premise i cloud, amb hacking ètic i compliment normatiu.

Més info

Business Intelligence

Quadres de comandament i anàlisi de dades amb Power BI: integrem les teves fonts, dissenyem dashboards i KPIs i convertim les teves dades en decisions.

Més info

Automatització de processos

Automatitzem tasques repetitives i connectem les teves aplicacions amb n8n, Power Automate, Make i RPA, eliminant treball manual i augmentant la productivitat.

Més info

Formació per a empreses

Formem els teus equips en tecnologia amb criteri: desenvolupament web, bases de dades, Git, bones pràctiques i seguretat, automatització amb n8n, intel·ligència artificial per a empreses i creació de solucions d'IA amb Azure AI Foundry.

Més info

Auditoria de codi

Auditem el codi que creguis tu, el teu equip o una IA: et diem què està bé i què millorar, el securitzem i el deixem llest per a producció, web o app.

Més info

Generació d'imatges amb IA

Creem per tu les imatges que necessita el teu negoci amb intel·ligència artificial: producte, xarxes, publicitat, il·lustració i avatars. Tu ens dius què vols i t'ho lliurem llest per fer servir.

Més info

Generació de vídeos amb IA

Creem per tu vídeos amb intel·ligència artificial: promocionals, per a xarxes, presentadors virtuals, doblatge i animacions. Ens comptes la idea i t'ho lliurem muntat i llest per publicar.

Més info

Avatars conversacionals amb IA

Creem avatars conversacionals amb IA —humans digitals amb cara i veu— que atenen els teus clients i equips amb el coneixement de la teva empresa, a la teva web, monitors interactius, WhatsApp o Teams.

Més info

Màrqueting Online i IA

Google Ads, Meta Ads, LinkedIn Ads i posicionament en motors d'IA (GEO/AEO): captem clients i fem que la teva marca aparegui on et busquen, també a ChatGPT, Gemini i Perplexity.

Més info

Tens un projecte en ment?

Explica'ns la teva visió i la convertim en una solució de programari. Sigui quin sigui l'abast, fem realitat la teva idea.

Live Chat