fix(angular): update schematics to support Angular's latest build system (#30525)

Issue number: resolves ionic-team/ionic-docs#2091

---------

## What is the current behavior?
Documentation to test `ng add` schematic for @ionic/angular is outdated
& it fails when running with:
```
Invalid projectType for my-app: undefined
```

## What is the new behavior?
Fix the schematic to support the latest Angular build system & update
the documentation for testing local Ionic Framework with `ng add`.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

## Other information

_I am using `Angular CLI: 20.0.4`_

Run these commands first to see the error: 
```sh
ng new my-app --style=css --ssr=false --zoneless=false
cd my-app
ng add @ionic/angular --skip-confirmation
```

Switch to this branch (`fix-angular-schematics`) and then follow the
[new
steps](b9b345303c/packages/angular/README.md (testing-local-ionic-framework-with-ng-add))
and confirm the error is gone.

--------

`Co-authored-by: soundproofboot <colinedwinbares@gmail.com>`

---------

Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
This commit is contained in:
Brandy Smith
2025-07-02 11:23:43 -04:00
committed by GitHub
parent 80a111cffa
commit 08e3e7ab51
2 changed files with 71 additions and 28 deletions

View File

@ -17,12 +17,15 @@ export function writeConfig(host: Tree, config: JsonObject): void {
function isAngularBrowserProject(projectConfig: any): boolean {
if (projectConfig.projectType === 'application') {
const buildConfig = projectConfig.architect.build;
// Angular 16 and lower
const legacyAngularBuilder = buildConfig.builder === '@angular-devkit/build-angular:browser';
// Angular 17+
const modernAngularBuilder = buildConfig.builder === '@angular-devkit/build-angular:application';
return legacyAngularBuilder || modernAngularBuilder;
// Angular 16 and lower
const legacyBrowserBuilder = buildConfig.builder === '@angular-devkit/build-angular:browser';
// Angular 17
const legacyApplicationBuilder = buildConfig.builder === '@angular-devkit/build-angular:application';
// Angular 18+
const modernApplicationBuilder = buildConfig.builder === '@angular/build:application';
return legacyBrowserBuilder || legacyApplicationBuilder || modernApplicationBuilder;
}
return false;