This version of CLI is only compatible with Angular versions

Error: This version of CLI is only compatible with Angular versions

This tutorial will guide you on how to fix Angular error “This version of CLI is only compatible with Angular versions 0.0.0 || ^10.0.0-beta || >=10.0.0 <11.0.0, but Angular version 9.1.11 was found instead“. Please visit update.angular.io to find instructions on how to update Angular.

Error: This version of CLI is only compatible with Angular versions

I had purchased new laptop and copied my Angular workspaces or projects from old laptop to the new one. I had installed node and angular CLI then I tried to run the project using ng serve command and gave me the following error.

>ng serve

This version of CLI is only compatible with Angular versions 0.0.0 || ^10.0.0-beta || >=10.0.0 <11.0.0,but Angular version 9.1.11 was found instead.

Please visit the link below to find instructions on how to update Angular.
https://update.angular.io/

It means that the version of Angular that I am using in my project is lower than the version that is needed for the latest version of Angular CLI that I have installed in my machine. Therefore I need to downgrade Angular CLI version from 10.0.5 -> 9.1.11.

>ng --version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 10.0.5
Node: 12.18.3
OS: win32 x64

Angular: 9.1.11
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: <error>

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1000.5
@angular-devkit/build-angular     0.1000.0
@angular-devkit/build-optimizer   0.1000.0
@angular-devkit/build-webpack     0.1000.0
@angular-devkit/core              10.0.5
@angular-devkit/schematics        10.0.5
@angular/cli                      10.0.5
@ngtools/webpack                  10.0.0
@schematics/angular               10.0.5
@schematics/update                0.1000.5
rxjs                              6.5.5
typescript                        3.8.3
webpack                           4.43.0

The following are the commands required to downgrade global angular CLI version installed. First, run the npm uninstall command to uninstall the latest version of angular CLI that’d been installed.

>npm uninstall -g @angular/cli
removed 280 packages in 2.229s

Then, install the required global version of angular CLI using the following command.

>npm install -g @angular/[email protected]
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: this library is no longer supported
C:\Users990\AppData\Roaming\npm\ng -> C:\Users990\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng

> @angular/[email protected] postinstall C:\Users990\AppData\Roaming\npm\node_modules\@angular\cli
> node ./bin/postinstall/script.js

+ @angular/[email protected]
added 281 packages from 206 contributors in 15.158s

Also install the required angular CLI for the local workspace as shown.

>npm install --save -dev @angular/[email protected]
npm WARN install Usage of the `--dev` option is deprecated. Use `--only=dev` instead.

> @angular/[email protected] postinstall C:\Users990\Documents\Nithi\Workspaces\Angular\udemy\my-app\node_modules\@angular\cli
> node ./bin/postinstall/script.js

npm WARN @angular-devkit/[email protected] requires a peer of @angular/[email protected]>=10.0.0-next.0 < 11 but none is installed. You must install peer dependencies yourself.
npm WARN @angular-devkit/[email protected] requires a peer of [email protected]>=3.9 < 3.10 but none is installed. You must install peer dependencies yourself.
npm WARN @ngtools/[email protected] requires a peer of @angular/[email protected]>=10.0.0-next.0 < 11 but none is installed. You must install peer dependencies yourself.
npm WARN @ngtools/[email protected] requires a peer of [email protected]>=3.9 < 3.10 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\webpack-dev-server\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\watchpack-chokidar2\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ @angular/[email protected]
added 4 packages from 6 contributors, removed 1 package, updated 11 packages and audited 1619 packages in 15.176s

50 packages are looking for funding
  run `npm fund` for details

found 2 low severity vulnerabilities
  run `npm audit fix` to fix them, or `npm audit` for details

Then change the version of angular CLI in your dev dependencies with the following command.

>npm install -D @angular/[email protected]

> @angular/[email protected] postinstall C:\Users990\Documents\Nithi\Workspaces\Angular\udemy\my-app\node_modules\@angular\cli
> node ./bin/postinstall/script.js

npm WARN @angular-devkit/[email protected] requires a peer of @angular/[email protected]>=10.0.0-next.0 < 11 but none is installed. You must install peer dependencies yourself.
npm WARN @angular-devkit/[email protected] requires a peer of [email protected]>=3.9 < 3.10 but none is installed. You must install peer dependencies yourself.
npm WARN @ngtools/[email protected] requires a peer of @angular/[email protected]>=10.0.0-next.0 < 11 but none is installed. You must install peer dependencies yourself.
npm WARN @ngtools/[email protected] requires a peer of [email protected]>=3.9 < 3.10 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\webpack-dev-server\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\watchpack-chokidar2\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ @angular/[email protected]
removed 1 package, updated 1 package and audited 1619 packages in 11.118s

49 packages are looking for funding
  run `npm fund` for details

found 2 low severity vulnerabilities
  run `npm audit fix` to fix them, or `npm audit` for details

Verify, whether angular CLI versions matches between local workspace and the global one.

>ng --version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 9.1.11
Node: 12.18.3
OS: win32 x64

Angular: 9.1.11
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.901.11
@angular-devkit/build-angular     0.1000.0
@angular-devkit/build-optimizer   0.1000.0
@angular-devkit/build-webpack     0.1000.0
@angular-devkit/core              9.1.11
@angular-devkit/schematics        9.1.11
@ngtools/webpack                  10.0.0
@schematics/angular               9.1.11
@schematics/update                0.901.11
rxjs                              6.5.5
typescript                        3.8.3
webpack                           4.43.0

Finally, try running ng serve  command again.

>ng serve

chunk {main} main.js, main.js.map (main) 24.3 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 141 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 765 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 2.71 MB [initial] [rendered]
Date: 2020-08-13T12:58:30.089Z - Hash: 2f98afd7e72983bfac50 - Time: 5511ms
** Angular Live Development Server is listening on localhost:4202, open your browser on http://localhost:4202/ **
: Compiled successfully.

That’s it the error “This version of CLI is only compatible with Angular versions 0.0.0 || ^10.0.0-beta || >=10.0.0 <11.0.0, but Angular version 9.1.11 was found instead” is gone away !

Hope this helped 🙂

Also See:

References:

Leave a Reply

avatar
  Subscribe  
Notify of