The future is standalone!

Angular v19 will make standalone: true the default for components, directives, and pipes.

In v14 we introduced a developer preview “standalone” feature, which made it possible for the first time to build an application that didn’t rely on NgModules. Since then, standalone has been stabilized, and has become the recommended way to write Angular code by the Angular team. The CLI generates components with standalone: true by default, and the Angular docs teach standalone first to all new Angular developers. Adoption is strong and continues to grow across the Angular ecosystem, both in the largest Angular applications written at Google as well as applications across the internet.

Not only does standalone make Angular easier to learn and get started with, it’s also enabled a few exciting new features. In @angular/router, loadComponent simplifies route-level lazy loading significantly and relies on standalone functionality. The Directive Composition API enables a better composition model for component behavior by allowing standalone directives to be applied in the declaration of a host component or directive. And of course, Deferrable Views transparently lazy-load standalone components and directives at the template level, making it easier than ever to optimize your Angular applications.

In v19 we’ll take the next step, and flip the default of the standalone flag in components, directives, and pipes, so you’ll never need to type “standalone: true” again. With this change, components like:

 @Component({ 
   standalone: true,
   imports: [UserAvatarComponent, AccountListComponent, FormsModule],
   selector: 'user-profile',  template: './user-profile-component.html',
 })
 export class UserProfileComponent {…}

will be written as:

 @Component({
   imports: [UserAvatarComponent, AccountListComponent, FormsModule],
   selector: 'user-profile',
   template: './user-profile-component.html',
 })
 export class UserProfileComponent {…}