ng generate commands no longer work after installing @ngrx/schematics

[marc-wilson]

Which @ngrx/* package(s) are the source of the bug?

schematics

Minimal reproduction of the bug/regression with instructions

Installing @ngrx/schematics breaks ng generate *. I am following the documentation trying to install ngrx schematics and it doesn't appear to be working. The first red flag is that the documentation states that running ng add @ngrx/schematics automates the addition of configuring your angular.json as such:

However, this is not true. Instead of cli.defaultCollection, we get cli.schematicCollections.

"cli": {
    "schematicCollections": [
      "@ngrx/schematics"
    ]
  }

If you were to change schematicCollections to defaultCollection, it works. Additionally, running the ng add command with the --defaultCollection flag has no impact.

Looking into what schematicsCollections is vs what is stated in the ngrx docs (defaultCollection) leads me to issue #3383. Maybe the documentation didn't get updated after this fix and it's causing confusion?

In any case, I am not sure if this is specific to angular version 15.1.1 or something else. But, if you follow the below reproduction steps, you can see that ng generate * is broken after you install @ngrx/schematics.

Here is the package.json from the fresh project:

{
  "name": "myproj",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^15.1.0",
    "@angular/common": "^15.1.0",
    "@angular/compiler": "^15.1.0",
    "@angular/core": "^15.1.0",
    "@angular/forms": "^15.1.0",
    "@angular/platform-browser": "^15.1.0",
    "@angular/platform-browser-dynamic": "^15.1.0",
    "@angular/router": "^15.1.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.12.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^15.1.2",
    "@angular/cli": "~15.1.2",
    "@angular/compiler-cli": "^15.1.0",
    "@ngrx/schematics": "^15.1.0",
    "@types/jasmine": "~4.3.0",
    "jasmine-core": "~4.5.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.0.0",
    "typescript": "~4.9.4"
  }
}

Minimal reproduction of the bug/regression with instructions

1. Create new Angular project using Angular CLI (v15.1.1)
2. Generate a new component to prove it's working (ng generate component something)
3. Install @ngrx/schematics (ng add @ngrx/schematics)
4. Go through the installation wizard in your terminal.
5. After @ngrx/schematics installation is complete, try and generate a component (ng generate component something)

You are met with an error

An unhandled exception occurred: Cannot destructure property 'aliases' of 'collection.description.schematics[schematicName]' as it is undefined.
See "/private/var/folders/lz/3jfzry_n75v3bvvvjs1549380000gn/T/ng-xnsbr0/angular-errors.log" for further details.

Versions of NgRx, Angular, Node, affected browser(s) and operating system(s)

NgRx: 15.1.0 (is there a 15.1.1 on the horizon? assuming this should match the angular version...)
Angular: 15.1.1
Node: 18.13.0
Mac: Ventura 13.1

Other information

No response

I would be willing to submit a PR to fix this issue

• Yes
• No

[millerbill3]

I'm seeing the same error whenever I try to generate an NGRX object (i.e. reducer)

[timdeschryver]

cli.defaultCollection was the old syntax, while schematicCollections is the new one.
This should be updated in our docs, but the ng add command handles it correctly.

I also tried to reproduce this but I couldn't reproduce this (maybe because it's using NgRx v15.2.1 but we didn't touch the schematics package).
Could you try again please?

I ended up with the following packages:

"dependencies": {
    "@angular/animations": "^15.1.0",
    "@angular/common": "^15.1.0",
    "@angular/compiler": "^15.1.0",
    "@angular/core": "^15.1.0",
    "@angular/forms": "^15.1.0",
    "@angular/platform-browser": "^15.1.0",
    "@angular/platform-browser-dynamic": "^15.1.0",
    "@angular/router": "^15.1.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.12.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^15.1.3",
    "@angular/cli": "~15.1.3",
    "@angular/compiler-cli": "^15.1.0",
    "@ngrx/schematics": "^15.2.1",
    "@types/jasmine": "~4.3.0",
    "jasmine-core": "~4.5.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.0.0",
    "typescript": "~4.9.4"
  }

[millerbill3]

I performed the update for NGRX and the CLI using the instructions here. This succeeded, but left me with the original error. Whenever I try to generate and NGRX object, I get the following:

$ ng g reducer store/reducers/processing --test-run
An unhandled exception occurred: Cannot destructure property 'aliases' of 'collection.description.schematics[schematicName]' as it is undefined.

Note: I did not use the --defaultCollection flag

I haven't tried creating any Angular objects, but assume I'll have the same issue. Here are my dependencies/versions (specific to NGRX and Angular):

Dependencies

"@angular-builders/custom-webpack": "^15.0.0-beta.0",
"@angular-devkit/build-angular": "^15.0.4",
"@angular/animations": "^15.0.4",
"@angular/cdk": "^15.0.3",
"@angular/cli": "^15.0.4",
"@angular/common": "^15.0.4",
"@angular/compiler": "^15.0.4",
"@angular/core": "^15.0.4",
"@angular/forms": "^15.0.4",
"@angular/localize": "^15.0.4",
"@angular/platform-browser": "^15.0.4",
"@angular/platform-browser-dynamic": "^15.0.4",
"@angular/router": "^15.0.4",
"@ngrx/effects": "^15.2.1",
"@ngrx/store": "^15.2.1",
"@ngrx/store-devtools": "^15.2.1",

Dev Dependencies

"@angular/compiler-cli": "^15.0.4",
"@ngrx/schematics": "^15.2.1",

[timdeschryver]

@millerbill3 that's also working in my case.
Can you make sure that it's using the correct angular version by running ng --version please?
Perhaps that's using an older version.

[millerbill3]

I ran ng version and got the following:

Angular CLI: 15.1.2
Node: 16.16.0
Package Manager: npm 9.2.0
OS: win32 x64

Angular: 15.1.1
... animations, cdk, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1501.2
@angular-devkit/build-angular   15.1.2
@angular-devkit/core            15.1.2
@angular-devkit/schematics      15.1.2
@angular/cli                    15.1.2
@schematics/angular             15.1.2
rxjs                            7.8.0
typescript                      4.8.4

[timdeschryver]

Do you perhaps got a repo that you can share?
I'm not able to reproduce this.

[anisabboud]

Try @angular/cli 15.1.3 - fixes angular/angular-cli#24586.

[sunanan]

Hi guys, do you try this?:

"cli": {
    "schematicCollections": ["@schematics/angular", "@ngrx/schematics"],
    "analytics": false
  },

just add "@schematics/angular" to "schematicCollections"
and:
--defaultCollection is not necessary

[millerbill3]

@sunanan your solution worked for me. thanks!

[timdeschryver]

Feel free to reopen with a reproduction.

[marc-wilson]

I believe my issue was due to package versions being off. I updated to the latest angular/cli, created a fresh project, and went through the process of ng adding all the ngrx stuff. After, I closely compared versions between a fresh project and the project that's having issues and there were indeed some subtle differences. Not sure if they are the root cause or not, but after getting everything updated, ng generate now works fine.