Cannot add @angular/pwa

Question

When trying any of:

ng add @angular/pwa
ng add @angular/pwa@17.1.0 --legacy-peer-deps
ng add @angular/pwa@17.1.2 --legacy-peer-deps

i get error:

$ ng add @angular/pwa@17.1.0 --legacy-peer-deps
ℹ Using package manager: npm
✔ Package information loaded.
 
The package @angular/pwa@17.1.0 will be installed and executed.
Would you like to proceed? Yes
✔ Packages successfully installed.
Schematic input does not validate against the Schema: {"legacyPeerDeps":true,"project":"sitemap-web-app","target":"build"}
Errors:
 
  Data path "" must NOT have additional properties(legacyPeerDeps).

my package.json

{
  "name": "web-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "lint": "ng lint",
    "prepare": "husky install"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^17.1.0",
    "@angular/common": "^17.1.0",
    "@angular/compiler": "^17.1.0",
    "@angular/core": "^17.1.0",
    "@angular/forms": "^17.1.0",
    "@angular/platform-browser": "^17.1.0",
    "@angular/platform-browser-dynamic": "^17.1.0",
    "@angular/router": "^17.1.0",
    "@mapbox/mapbox-gl-draw": "^1.4.3",
    "@ngrx/signals": "^17.1.0",
    "@types/mapbox__mapbox-gl-draw": "^1.4.6",
    "@types/mapbox-gl": "^2.7.20",
    "mapbox-gl": "^3.1.2",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.14.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^17.1.1",
    "@angular-eslint/builder": "17.2.1",
    "@angular-eslint/eslint-plugin": "^17.2.1",
    "@angular-eslint/eslint-plugin-template": "17.2.1",
    "@angular-eslint/schematics": "17.2.1",
    "@angular-eslint/template-parser": "17.2.1",
    "@angular/cli": "^17.1.1",
    "@angular/compiler-cli": "^17.1.0",
    "@types/jasmine": "~5.1.0",
    "@typescript-eslint/eslint-plugin": "6.19.0",
    "@typescript-eslint/parser": "6.19.0",
    "eslint": "^8.56.0",
    "eslint-config-prettier": "^9.1.0",
    "husky": "^8.0.0",
    "jasmine-core": "~5.1.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "lint-staged": "^15.2.1",
    "prettier": "3.2.4",
    "typescript": "~5.3.2"
  }
}

[UPDATE]

so, after doing npm i -g @angular/cli@17.1.2, deleting node_modules and package.lock.json and running npm install, now I get:

$ ng add @angular/pwa
- Determining package manager...
i Using package manager: npm
- Searching for compatible package version...
√ Found compatible package version: @angular/pwa@17.1.2.
- Loading package information from registry...
√ Package information loaded.
No terminal detected. '--skip-confirmation' can be used to bypass installation confirmation. Ensure package name is correct prior to '--skip-confirmation' option usage.
Command aborted.

Answer 1

I think the version of @angular/cli installed at the global level is the problem, could you try running the below command and trying again after you deleted the node_modules and package-lock.json.

npm i -g @angular/cli@17.1.2 

Because I tried the same steps with the same logic and configuration in stackblitz and it worked fine!