This is Part 3 of a 6-part series on Angular Schematics.
- ✅ Part 1 - Understanding Angular Schematics: Architecture & Core Concepts
- ✅ Part 2 - Creating Custom Generators with ng generate
- Part 3 - Building Installation Schematics with ng add ← You are here
- 🔜 Part 4 - Writing Migration Schematics with ng update
- 🔜 Part 5 - Testing Schematics with Angular DevKit
- 🔜 Part 6 - Advanced Patterns, Publishing & Nx Integration
🤖 A note on this article: I used Claude to help reformat and structure the content to make it clearer and more presentable for publication.
References
@angular-devkit/schematicsIn Part 2 we built a custom ng generate schematic that scaffolds a component with your organisation's selector prefix. We understand the workspace setup, collection.json, schema.json, factory functions, and file templates.
Part 3 is about a different problem entirely. Not generating code inside a project that already has your library - but automating what happens the very first time a developer installs it.
When a developer runs:
ng add @acme/ui
They should not have to read a 12-step setup guide. The library should configure itself - install its peer dependencies, update angular.json, add any required styles, and leave the workspace in a working state. That is what an ng add schematic does.
By the end of this article you will have built a complete ng add schematic that handles the full installation lifecycle of a library.