ashilon
ashilon

Reputation: 1951

Add Angular Material to ASP.NET CORE project in Visual Studio 2015

I'm having some difficulties adding Angular Material to our ASP.NET CORE project. I've tried several ways to add it:

  1. Via Nuget - Although there is a package, NuGet didn't download anything
  2. Via Bower - According to Microsoft's docs, this is now the preferred way for working with client packages. But when I search for it in the Bower package mannager ui, it can't find it. Same with the bower.json file.

So how do I add it to the project? We need to replace all the Bootstrap references in our (new) project with angular material.

thanks,

ashilon

Upvotes: 2

Views: 3918

Answers (2)

Jakub Solarz
Jakub Solarz

Reputation: 45

maybe this article will help you: Angular Material – Using with Angular 2 and ASP.NET Core 1.0

Step 2: Open the command prompt containing package.json and run below command to install Angular Material components. I am installing all the available packages now.

Command to install Material NPM packages

npm install --save @angular2-material/core @angular2-material/button @angular2-material/card  @angular2-material/checkbox @angular2-material/grid-list @angular2-material/icon @angular2-material/input @angular2-material/list @angular2-material/progress-bar @angular2-material/progress-circle @angular2-material/radio @angular2-material/sidenav  @angular2-material/tabs @angular2-material/toolbar

Upvotes: 1

Clint B
Clint B

Reputation: 4710

Just start typing angular in a new line in the bower.json file and the angular packages will appear in intellisense. When you type the colon after the name of the package and hit the space bar, give it a second and all available versions of that package will be displayed in intellisense.

When you save the file, Visual Studio will automatically run the bower install command to download the package and save it to the location defined in the directory setting in file .bowerrc.

To view the bower.json and .bowerrc files you have to select "Show All Files" in the Solution Explorer.

Upvotes: 3

Related Questions