TypeError: Cannot convert undefined or null to object - Adding @angular/material:ng-add to application

[Chowarmaan]

Current Behavior

I am trying to add Angular Material to a new Angular application in a NX workspace. During the nx generate @angular/material:ng-add or nx generate @angular/material:ng-add-setup-project, there is a TypeError: Cannot convert undefined or null to object returned.

Expected Behavior

This did work in previous versions (nx 13.x) for me, but not with the current 14.3.1 version.

$ nx --version

14.3.1

Steps to Reproduce

1. Create a new workspace

   $ npx create-nx-workspace@latest ws
   √ Nx has successfully created the workspace.

2. Install @nrwl/angular into the workspace

   $ npm install --location=project --save-dev @nrwl/angular

   added 251 packages, and audited 653 packages in 10s
   found 0 vulnerabilities

3. Add an Angular application to the workspace

   $ nx generate @nrwl/angular:app --name=timesheet --routing

   NX Generating @nrwl/angular:application
   √ Which stylesheet format would you like to use? · css

   npm WARN config global --global, --local are deprecated. Use --location=global instead.
   npm WARN deprecated source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated

   ws@0.0.0 postinstall
   ngcc --properties es2020 browser module main

   added 650 packages, changed 3 packages, and audited 1303 packages in 35s
   found 0 vulnerabilities

4. Install Angular Material

   $ npm install --location=project --save @angular/material

   npm WARN config global --global, --local are deprecated. Use --location=global instead.
   added 1 package, removed 1 package, and audited 1304 packages in 6s
   found 0 vulnerabilities

5. Verify Angular Material is installed with nx list

   $ nx list @angular/material

   NX Capabilities in @angular/material:
   GENERATORS

   ng-add : Adds Angular Material to the application without affecting any templates
   ng-add-setup-project : Sets up the specified project after the ng-add dependencies have been installed.
   dashboard : Create a card-based dashboard component
   table : Create a component that displays data with a data-table
   navigation : Create a component with a responsive sidenav for navigation
   tree : Create a file tree component.
   addressForm : Create a component with an address form

6. Add Angular Material to the application with nx.

   $ nx generate @angular/material:ng-add --project=timesheet

   NX Generating @angular/material:ng-add
   √ Choose a prebuilt theme name, or "custom" for a custom theme: · indigo-pink
   √ Set up global Angular Material typography styles? (y/N) · false
   √ Include the Angular animations module? · excluded
   √ Packages installed successfully.
   [NX] Angular devkit called writeWorkspace, this may have had unintended consequences in workspace.json
   [NX] Double check workspace.json before proceeding
   Your project is not using the default builders for "test". This means that we cannot add the configured theme to the "test" target.

   TypeError: Cannot convert undefined or null to object
   at NxScopedHost.writeWorkspaceConfiguration (ws\node_modules\nx\src\adapter\ngcli-adapter.js:320:9)
   at ws\node_modules\nx\src\adapter\ngcli-adapter.js:215:29
   at ws\node_modules\rxjs\dist\cjs\internal\operators\switchMap.js:17:35
   at OperatorSubscriber._this._next (ws\node_modules\rxjs\dist\cjs\internal\operators\OperatorSubscriber.js:28:21)
   at Subscriber.next (ws\node_modules\rxjs\dist\cjs\internal\Subscriber.js:72:18)
   at ws\node_modules\rxjs\dist\cjs\internal\operators\switchMap.js:17:190
   at OperatorSubscriber._this._next (ws\node_modules\rxjs\dist\cjs\internal\operators\OperatorSubscriber.js:28:21)
   at Subscriber.next (ws\node_modules\rxjs\dist\cjs\internal\Subscriber.js:72:18)
   at SafeSubscriber.__tryOrUnsub (ws\node_modules@angular-devkit\core\node_modules\rxjs\internal\Subscriber.js:205:16)
   at SafeSubscriber.next (ws\node_modules@angular-devkit\core\node_modules\rxjs\internal\Subscriber.js:143:22)
   Cannot convert undefined or null to object

Using the ng-add-setup-project fails as well $ nx generate @angular/material:ng-add-setup-project --project=timesheet. Using the Angular Material typography or installing the animations enabled or disabled) all fail with the same errors.

Failure Logs

Environment

$ nx report
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.

>  NX   Report complete - copy this into the issue template

Node : 18.3.0
OS   : win32 x64
npm  : 8.11.0

nx : 14.3.4
@nrwl/angular : 14.3.4
@nrwl/cypress : 14.3.4
@nrwl/detox : Not Found
@nrwl/devkit : 14.3.4
@nrwl/eslint-plugin-nx : 14.3.4
@nrwl/express : Not Found
@nrwl/jest : 14.3.4
@nrwl/js : Not Found
@nrwl/linter : 14.3.4
@nrwl/nest : Not Found
@nrwl/next : Not Found
@nrwl/node : Not Found
@nrwl/nx-cloud : Not Found
@nrwl/nx-plugin : Not Found
@nrwl/react : Not Found
@nrwl/react-native : Not Found
@nrwl/schematics : Not Found
@nrwl/storybook : 14.3.4
@nrwl/web : Not Found
@nrwl/workspace : 14.3.4
typescript : 4.7.3
---------------------------------------
Community plugins:

[leosvelperez]

Thanks for reporting this!

This issue has been fixed in #10758 and released as part of v14.3.5. Please migrate to the latest version to get the fix

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.