angular-tooling

Guide Angular CLI workflows for scaffolding, generation, and build/test configuration.

Updated Apr 17, 2026
One-click install
npx skills add https://github.com/Manu343726/audible-exporter --skill angular-tooling-manu343726
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: angular-tooling
Source: https://github.com/Manu343726/audible-exporter/tree/main/.agents/skills/angular-tooling
Command: npx skills add https://github.com/Manu343726/audible-exporter --skill angular-tooling-manu343726

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It helps Angular developers avoid slow, error-prone tooling setup and repeatable build/test/config mistakes when working on Angular v20+ applications.

Core Features & Use Cases

  • Project setup and conventions: Create new Angular projects with correct defaults for standalone, styling, routing, and minimal footprints.
  • Efficient code generation: Generate components, services, directives, pipes, guards, interceptors, and class-like models using consistent schematics options.
  • Build, test, and production configuration: Run dev servers, production builds, unit tests, E2E (when configured), linting, and common optimization knobs with Angular CLI builders.
  • Use Case: When you need a new feature quickly (e.g., a users dashboard with routing and OnPush change detection), you can generate the exact Angular artifacts and then build/test using the recommended CLI paths.

Quick Start

Use angular-tooling to generate an Angular component named "user-profile" in the "features" folder, then run the build and tests for an Angular v20+ project.

Frequently Asked Questions about angular-tooling

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate an Angular component with routing and OnPush change detection?

To generate an Angular component with routing and OnPush change detection, use Angular CLI schematics. Execute ng generate with specific schematics options to scaffold the component, ensuring consistent standalone defaults and minimal footprint for your Angular v20+ project.

What is the correct way to set up a new Angular v20+ project with standalone defaults?

Setting up a new Angular v20+ project involves using the ng new command to create the application. This establishes correct defaults for standalone components, styling, routing, and minimal footprints without relying on non-Angular CLI build systems or custom Webpack configurations.

Can I use custom Webpack or Nx commands for Angular builds and tests?

You cannot use custom Webpack or Nx commands with this approach. It strictly focuses on Angular CLI builders for running dev servers, production builds, unit tests, and linting workflows, intentionally avoiding non-Angular CLI build systems and custom Webpack configurations.

How do I configure unit tests and production builds in an Angular CLI project?

Configuring unit tests and production builds in an Angular CLI project utilizes Angular CLI builders. You run ng test for unit tests and ng build for production builds, applying common optimization knobs within the constraints of the Angular CLI environment.

What's the best way to scaffold Angular services, guards, and interceptors consistently?

The best way to scaffold Angular services, guards, and interceptors consistently is using ng generate schematics. This ensures all class-like models and artifacts follow unified conventions and standard Angular CLI constraints for your v20+ project setup.