Visual Studio 2017 spa angular material

2
votes

I have tried to add Angular Material to the spa template from Visual Studio 2017. I added the Angular packages described in the Angular Material guide. I then added the following packages to webpack.config.vendor.js:

'@angular/material',
'@angular/material/prebuilt-themes/deeppurple-amber.css',

After that I ran the following command: webpack --config webpack.config.vendor.js.

Next step I add the modules to app.module.browser.ts as you can see in the image below.

Code

When I run the project there are no errors in the console and the normal html button displays and not the material button.

I found this article online and was also following it: CodeProject Article.

Is there anything else I need to add to get this to work or is there any other tutorial I can follow?

Thanks

1
angularvisual-studio-2017

1 Answers

0
votes
  1. Try to import angular material modules into app.module.shared.ts, not app.module.browser.ts.
  2. Try to use mat- prefix instead of md- prefix in HTML. (This may be relied on version of angular material. The version of angular material in my project is v.5.)

P.S. If Hot Module Replacement does not worke, please try this: https://github.com/aspnet/JavaScriptServices/issues/1165#issuecomment-335984443