Cannot find module '@schematics/angular/utility/project'

13
votes

If I do ionic generate component xxx

An unhandled exception occurred: Cannot find module '@schematics/angular/utility/project' Require stack:

  • /Users/user/develop/myapp/node_modules/@ionic/angular-toolkit/schematics/component/index.js

  • /Users/user/develop/myapp/node_modules/@angular-devkit/schematics/tools/export-ref.js

  • /Users/user/develop/myapp/node_modules/@angular-devkit/schematics/tools/index.js

  • /Users/user/develop/myapp/node_modules/@angular/cli/utilities/json-schema.js

  • /Users/user/develop/myapp/node_modules/@angular/cli/models/command-runner.js

  • /Users/user/develop/myapp/node_modules/@angular/cli/lib/cli/index.js

  • /Users/user/develop/myapp/node_modules/@angular/cli/lib/init.js

  • /Users/user/develop/myapp/node_modules/@angular/cli/bin/ng

    Ionic:

     Ionic CLI                     : 6.10.1 (/usr/local/lib/node_modules/@ionic/cli)
 Ionic Framework               : @ionic/angular 5.2.3
 @angular-devkit/build-angular : 0.1000.2
 @angular-devkit/schematics    : 10.0.2
 @angular/cli                  : 10.0.2
 @ionic/angular-toolkit        : 2.2.0

    Capacitor:

     Capacitor CLI   : 2.1.2
 @capacitor/core : 2.1.2

    Cordova:

     Cordova CLI       : 9.0.0 ([email protected])
 Cordova Platforms : android 8.1.0
 Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.2.1, (and 7 other plugins)

    Utility:

     cordova-res : not installed
 native-run  : not installed

    System:

     ios-sim : 8.0.2
 NodeJS  : v12.18.1 (/usr/local/bin/node)
 npm     : 6.14.6
 OS      : macOS Catalina
 Xcode   : Xcode 11.5 Build version 11E608c
5
javascriptangularionic-frameworkionic-native

5 Answers

52
votes

Seems like it's an ionic incompatibility with angular 10+

THIS WORKED FOR ME

npm uninstall @schematics/angular
npm install @schematics/[email protected]
4
votes

You may first proceed with npm uninstall @schematics/angular and TERMINAL informs that "removed XX packages and audited XXXX packages" etc, then you may implement npm install @schematics/[email protected].

Accordingly, ng add ngx-bootstrap provides:

✅️ Added "bootstrap

✅️ Added "ngx-bootstrap

2
votes

In my case it was to have this:

"@ionic/angular-toolkit": "^2.3.3"

instead of "^2.2.0"

My Angular: 10.1.4.

I found this out by creating fresh Ionic project after upgrading Ionic CLI to newest.

0
votes

This worked for me.

npm i --save-dev @nativescript/schematics
0
votes

The problem is schematics module incompatibility.

  1. Find out the version of the @schematics/angular
node_modules/@schematics/angular/package.json/#_from
  1. Find out the version of @schematics/angular which used in the @ionic/angular-toolkit module.
node_modules/@ionic/angular-toolkit/package.json

// package.json 

"dependencies": {
    "@schematics/angular": "^11.2.4",  
}

  1. Make sure the versions are matching.

  2. If the versions do not match, then install the matching version of @schematics/angular.

  3. Have an awesome day!