How to add and update npm packages for a new Angular app in Visual Studio 2019

1
votes

I just installed and created my first Angular app in Visual Studio 2019. I used the .Net Core Web Application type project and the Angular framework. I see in the package.json file, Angular 6.1.10 is being used. I know I can install packages using the cli, but how do I install new packages (ex. Angular 7 or Angular Material), from/within the Visual Studio UI and update old packages to newer versions?

I'd like to try and stay within the VS 2019 UI!

Is this even possible in the VS UI?

3
angularnpmnpm-installvisual-studio-2019

3 Answers

4
votes

As you want to try and stay within the VS 2019 UI!

Open VS 2019 --> From right side, click on 'Open a local folder'(Of course you can use alternative ways too) --> Navigate to ClientApp or Whatever your folder name where package.json exists.

Then, `Tools --> NuGet Package Manager --> Package Manager Console`

As you specified "I know I can install packages using the cli", use your required commands. For commands, see @Mahi's answer.

In this way, you dont need to come out from VS 2019.

3
votes

As Sajeetharan, mentioned there is no separate support from VS2019.

Try this:-

1) npm uninstall -g @angular/cli
2) npm install -g @angular/cli@latest
3) npm install --save @angular/material @angular/cdk @angular/animations

and,

Update old packages to new packages:-

npm i -g npm-check-updates
ncu -u
npm install
0
votes

There is NO support in terms of UI support in Visual studio 2019 and i would say it is not needed as well.

You can always go and add the necessary packages needed and do a npm i. I personally open the ClientApp folder in VSCODE which makes development easier for Angular