Having trouble updating Angular CLI

It appears that I have successfully installed version 9 as per the usual installation process. 

npm install -g @angular/cli
npm WARN deprecated <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="d9abbca8acbcaaad99ebf7e1e1f7eb">[email protected]</a>: request has been deprecated, see https://github.com/request/request/issues/3142
/home/user/.npm-global/bin/ng -> /home/user/.npm-global/lib/node_modules/@angular/cli/bin/ng

> @angular/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="6407080d245d4a554a55">[email protected]</a> postinstall /home/user/.npm-global/lib/node_modules/@angular/cli
> node ./bin/postinstall/script.js

+ @angular/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="debdb2b79ee7f0eff0ef">[email protected]</a>
updated 1 package in 8.412s

┌─────────────────────────────────────────────────────────┐
│                 npm update check failed                 │
│           Try running with sudo or get access           │
│          to the local update config store via           │
│ sudo chown -R $USER:$(id -gn $USER) /home/user/.config  │
└─────────────────────────────────────────────────────────┘
user@computer:~$ npm list -g
/home/user/.npm-global/lib
├─┬ @angular/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="84e7e8edc4bdaab5aab5">[email protected]</a>

However, every time I create a new app using 'ng new app-name', version 8 gets installed instead. Upon checking the version using 'ng --version', it still shows that v8 is being used.

ng --version    

Angular CLI: 8.0.3
Node: 12.16.2
OS: linux x64
Angular: 
... 

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.800.3
@angular-devkit/core         8.0.3
@angular-devkit/schematics   8.0.3
@schematics/angular          8.0.3
@schematics/update           0.800.3
rxjs                         6.4.0

If anyone could offer some assistance, it would be greatly appreciated.

angularnpmangular-clinode-modules

Answer №1

If you are a user of nvm, here are some important notes for you:

If you had @angular/cli globally installed before setting up nvm and have switched to a different node version using nvm, the following information may be helpful:

When you change your node version with nvm, the npm folder location where your global node_modules reside also changes.

For example, if I switch to node 14 (nvm use 14) and install the latest angular cli using:

npm install @angular/cli -g

You will receive confirmation that Angular has been successfully installed. After running ng --version to check the version, you may notice the old version is still present. This can be confusing.

The node for NVM can be found at: 

/Users/<USER_NAME>/.nvm/versions/node/v14.XX.XX/bin

After installing @angular/cli globally, a shortcut/symlink for ng is created in this directory.

lrwxr-xr-x  1 X  staff        39 Aug 14 10:45 ng -> ../lib/node_modules/@angular/cli/bin/ng
-rwxr-xr-x  1 X  staff  76198080 Aug 11 06:29 node
lrwxr-xr-x  1 X  staff        38 Aug 14 10:42 npm -> ../lib/node_modules/npm/bin/npm-cli.js
lrwxr-xr-x  1 X  staff        38 Aug 14 10:42 npx -> ../lib/node_modules/npm/bin/npx-cli.js

This points to the node 14 node_modules folder located at: 

/Users/<USER_NAME>/.nvm/versions/node/v14.XX.XX/lib/node_modules

However, if you had previously installed @angular/cli globally before using nvm, the old version might be causing conflicts.

To resolve this issue, locate where the global node_modules were installed before NVM was set up. In my case, it is: /usr/local/lib/node_modules.

Navigate to that folder and remove the @angular package. Restart your terminal and run ng --version. You should now see the correct version of ng.

This solution also applies to other modules.

Answer №2

It seems your user lacks the necessary permissions to modify the angular cli directory. One potential solution is provided by npm within your terminal. Try running the following command to see if it resolves the issue:

   sudo chown -R $USER:$(id -gn $USER) /home/user/.config

Answer №3

After encountering some problems, I decided to uninstall nodejs and npm before reinstalling them using nvm. I was left with no other option but to execute 

sudo chown -R $USER:$(id -gn $USER) /home/user/.config
, risking the integrity of my projects. Fortunately, everything turned out well in the end. Next, I faced an issue with nvm settings not persisting, but I managed to resolve it by following this helpful advice.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Error: A stream was expected, but you provided 'undefined'. Please provide either an Observable, Promise, Array, or Iterable instead

I'm encountering an error while trying to catch errors in my Ionic-based application with Angular. In the create() method, I am attempting to create a new User. If the username already exists, I receive a response from the backend, but my method thro ...

angulartypescriptionic-framework

Strange behavior in Angular's http response

When I make a call to my API and receive a JSON response, the code snippet below illustrates how I handle it: getAllLearn() { this.learnService.getAllLearn().subscribe(res =>{ // The console log shows that res.featured only has one index: ( ...

javascriptangular

Access the Ionic2 App through the Slider option

Trying out Ionic 2 and facing an issue. Created a default side-menu app from CLI with a slider. Need to start the actual side-menu app from the last slide on button click or anchor link. My app.ts: @Component({ templateUrl: 'build/app.html' }) ...

angulartypescriptionic2ionic3

The issue with Angular 4 imports not refreshing in a .less file persists

Currently, I am in the process of developing a small Angular project that utilizes less for styling purposes. My intention is to separate the styling into distinct folders apart from the components and instead have a main import file - main.less. This fil ...

cssangulartypescriptimportless

Displaying data from a service on an Ionic screen: a comprehensive guide

I've retrieved JSON data from an API: { "userGroups":[ {"title":"group 1"}, {"title":"group 2"}, {"title":"group 3"}, {"title":"group 4"} ] } Currently, I am storing this raw data in NativeStorage. // userService this.userGroup ...

angularionic-framework

The most recent npm version is experiencing functionality issues on Linux systems

After updating npm to the latest version, I encountered some issues on my Linux system. When attempting to install new modules, I received the following errors: Cannot find module 'asynckit' Cannot find module 'reflect-metadata' Canno ...

node.jslinuxnpm

Encountering Unmet Dependency Issue When Running 'npm install' on Laravel in Windows 8

Currently, I am in the process of working on a Laravel project and looking to utilize Elixir to handle my front-end tasks. After running 'npm install', I encountered a warning stating "npm WARN unmet dependency". What steps should I take in order ...

javascriptwindows-8npm

When attempting to upgrade from Angular 10 to 13, users may encounter the following error message: "TS2307: Unable to locate module 'path_to_service' or its corresponding type declarations."

I initially developed my Angular App using the paper-dashboard template with Angular version 10.0. Recently, I upgraded to Angular version 13 and switched to a different template - WrapPixel. However, I encountered an error when trying to include a servi ...

angulartypescript

Is it feasible to run an "npm install" on code modifications made after the last version number update?

Hi there, I'm new to npm and have a question. Sorry for being a beginner. I am utilizing the node-dbus npm module, which is currently on version 0.2.0. However, I noticed that there have been some code changes added since the version was last updated ...

node.jsnpmnpm-install

Testing the open dialog with a unit test case

I encountered an issue while writing a unit test case for the open dialog feature in Angular 7. A TypeError is being thrown: "Cannot read property 'debugElement' of undefined." I am seeking assistance from anyone who can help me troubleshoot this ...

angularunit-testing

How does node.js add value to SharePoint?

After spending some time researching on the web, I came across information about using Node.js with SharePoint. Although there is a SharePoint npm package available, I haven't been able to pinpoint a clear purpose for integrating Node.js with SharePoi ...

node.jssharepointnpm

Encountering difficulties while trying to install gulp-sass on npm version 7.5.1

I'm currently in the process of learning how to utilize tools like gulp, sass, and other Node.js modules. However, I've encountered a problem while attempting to install gulp-sass. Here's the series of steps I'm following for installati ...

npmsassgulpgulp-sass

When attempting to assign a variable in my ngModel, what issue could be causing a problem?

I am facing an issue while trying to implement ngModel in my code. The code is not executing properly and an error is being displayed. Below is the code snippet: contact-form.component.html: <div class="container"> <form> <div class ...

htmlangular

What is the best way to identify the main dark color in Angular Material, and what other color variables are available for use with Angular Material?

Hey there, I'm trying to figure out how to utilize the primary dark color from angular material. I attempted using color="p-dark" but it doesn't seem to be working. Any ideas on how to access the dark color defined by the material color tool? I w ...

angularangular-material

Problem with updating Cypress e2e tests following recent package upgrades

My current project involved updating all the packages to their latest versions. Prior to the update, all end-to-end tests were functioning correctly without any issues. After completing the update, the product itself compiles and runs as expected without ...

angularcypresse2e-testingaxe

Error occurred while trying to parse JSON due to an abrupt ending

While attempting to reinstall one of my old vue projects on my new computer (running Windows 10) using npm, I encountered the following error: npm ERR! Unexpected end of JSON input while parsing near '...n":"0.8.1","devDepend' ...

javascriptnode.jsvue.jsnpmvuejs2

Is there a method to automatically eliminate all unnecessary properties in an Angular project?

In my extensive Angular project, I suspect that there are numerous declared properties in .component.ts that are not being used. Is there a method available to automatically eliminate all unused properties within an Angular project while also taking into ...

angulartypescript

Retrieve class attributes within callback function

I have integrated the plugin from https://github.com/blinkmobile/cordova-plugin-sketch into my Ionic 3 project. One remaining crucial task is to extract the result from the callback functions so that I can continue working with it. Below is a snippet of ...

javascriptangulartypescriptionic-frameworkcallback

Having trouble with the installation of Vue CLI

Can you please explain the meaning of this? What steps should I take with regards to this issue while setting up vue? Is it a common occurrence or something that needs special attention? > <a href="/cdn-cgi/l/email-protection" class="__cf_email__" ...

node.jsbashnpmvue.js

Encountering login difficulties during initial login attempts may result in automatic logout upon page refresh within Angular+(Node/express).js framework

After attempting to log in for the first time, I noticed that the authentication process in AuthService sets the loggedInStatus to true. However, in AuthGuard, the loggedIn status is set to false, preventing navigation to the dashboard. Additionally, the c ...

node.jsangularexpressexpress-sessionangular-route-guards