Releases: cyrilletuzi/vscode-angular-schematics
v7.0.0
New naming conventions
Angular 20 changed the naming conventions for class and file names:
- no more class and file names suffix for components, directives and services:
ProductCardComponentinproduct-card.component.ts=>ProductCardinproduct-card.tsProductApiServiceinproduct-api.service.ts=>ProductApiinproduct-api.tsMissingProductDirectiveinmissing-product.directive.ts=>MissingProductinmissing-product.ts
- suffix kept for the other concepts, but file name suffix separator changed from
.to-:CustomDatePipeincustom-date.pipe.ts=>CustomDatePipeincustom-date-pipe.tsProductsPageinproducts.page.ts=>ProductsPageinproducts-page.tsauthInterceptorinauth.interceptor.ts=>authInterceptorinauth-interceptor.tsauthGuardinauth.guard.ts=>authGuardinauth-guard.tsdataResolverindata.resolver.ts=>dataResolverindata-resolver.ts
Angular refers to these 2 different naming conventions as:
- the former 2016 style guide, up to Angular 19
- the new 2025 style guide, which is the default since Angular 20
This extension now follows the new naming conventions by default. But you can switch back to the legacy naming conventions in one click with the configuration helper (it must be done in each workspace).
As a reminder, this extension is not developed by the Angular team or affiliated to Google in any way. It is months of unpaid work by a single contributor. So if you do not like this change, I am not responsible for it, and again, you can switch back to the previous behavior.
"Copy settings from angular.json" will take into account type and typeSeparator options (which are automatically added when migrating an Angular 19 project to Angular 20 via ng update).
Pro edition users can additionnaly:
- set custom suffixes
- set a suffix only for the class name but not for the file name
- set a suffix only for the file name but not for the class name
Also for the Pro edition users having custom schematics with suffix, a new fileNameSuffix property is introduced for the schematic.json configuration. For backward compatibility, it defaults to .suffix, but this behavior may be removed in the future. It is strongly recommended to add an explicit fileNameSuffix to all your schematic.json using suffix.
Other changes
skipClassSuffixoption for components, directives and services is removed, as it is now the default behavior- Angular ESLint suffixes management (both in the configuration helper and the
angularEslintComponentSuffixfeature for custom schematics) is removed as it does not make sense anymore and asangular-eslintremoved the rule from the recommended set in version 20
v6.23.0
In the Pro edition, you can now enable automatic classes prefixes, for example to generate MatButtonComponent instead of ButtonComponent (given "mat" is set as the selector prefix). It is useful when doing a library of components.
As usual, use the configuration helper to set this option.
v6.22.0
In the Pro edition, you can now disable automatic classes suffixes, for example to generate SomeButton instead of SomeButtonComponent, or SomeApiClient instead of SomeApiClientService.
This option allows to partly align with the upcoming new Angular style guide, being discussed in this RFC.
It has also been the standard in some design systems libraries since always, like Angular Material itself (it is MatButton, not MatButtonComponent).
As usual, use the configuration helper to set this option.
v6.21.0
Add the following imports in the Pro edition:
- AG Grid (module and standalone)
- AG Charts (module and standalone)
v6.20.0
Add the following imports in the Pro edition:
- ngx-translate v16 standalone directive and pipe
- ng-select v13.7 standalone component
- all ngx-bootstrap v18.1 standalone components and directives
- all Kendo v16.6 standalone components and directives
- ngxs/form-plugin v18 standalone directive
- ng2-chart v6 standalone directive
- ngx-highlightjs v10 standalone directives
- ngx-quill v21 standalone components
v6.19.0
Add the following imports in the Pro edition:
- Angular Material 19
MatTimepicker(and related) - Ionic 8
IonInputPasswordToggle - all PrimeNG 18 standalone components and directives
- PrimeNG 17.12
InputOtpModule,StepperModule - PrimeNG 17.9
MeterGroupModule,FloatLabelModule,InputIconModule,IconFieldModule - PrimeNG 17.0
InputGroupModule,InputGroupAddonModule - all NG-Zorro 17.1 standalone components and directives
v6.18.0
- Support for standalone components being the default in Angular 19.
- Remove the default
CommonModuleimport in standalone components in the free edition.