installing Angular Material in Visual Studio solution

Question

I have a large Visual Studio solution (running VS 2017) where some projects contain AngularJS (1.4.7) and some contain Angular (2.0). I don't think that's a problem, just making full disclosure.

I am currently trying to install Angular Material for use in the Angular project.

First question: are material and material2 synonymous? I know there's a material for AngularJS, and I know there's a material for Angular, but they seem to use them interchangeably - or at least drop the version number occasionally. I go to install material2 and I find myself installing material. I am hoping that it is just taking care of the correct versioning for me.

Using Powershell in my node_modules/@angular directory, I am running this:

npm install --SAVE angular-material

But this is what I get:

[email protected] C:\proj\ClientPortal\dev\Leaves\MorneauShepell.ClientPortal\MorneauShepell.ClientPortal.Web
+-- UNMET PEER DEPENDENCY angular@>=1.3 <1.7
+-- UNMET PEER DEPENDENCY angular-animate@>=1.3 <1.7
+-- UNMET PEER DEPENDENCY angular-aria@>=1.3 <1.7
`-- [email protected]

[email protected] C:\proj\ClientPortal\dev\Leaves\myCo.ClientPortal\myCo.ClientPortal.Web
+-- UNMET PEER DEPENDENCY angular@>=1.3 <1.7
+-- UNMET PEER DEPENDENCY angular-animate@>=1.3 <1.7
+-- UNMET PEER DEPENDENCY angular-aria@>=1.3 <1.7
`-- [email protected]

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\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 [email protected] requires a peer of angular@>=1.3 <1.7 but none was installed.
npm WARN [email protected] requires a peer of angular-animate@>=1.3 <1.7 but none was installed.
npm WARN [email protected] requires a peer of angular-aria@>=1.3 <1.7 but none was installed.

I'm afraid I don't know why it's complaining or what do about it.

(Mod edit: "Use angular 2.x instead". That tag does not show up. It just defaults to angular anyway) — DaveC426913
– DaveC426913, Commented May 23, 2017 at 16:57

joh04667 · Accepted Answer · 2017-05-23 18:04:20Z

Yes, they are completely different libraries, each with their own syntax. You are installing the Material library for AngularJS with angular-material (For the record, Material for Angular 2+ is the package @angular/material). The Material library for Angular 2+ was originally called material2, but this name was revisioned and it's rarely referred to as material2, just Material. The repo for @angular/material is also still called material2.

Here, npm is telling you that you have some unmet dependencies. The docs for angualr-material (which I'll reference as AngularJS Material) state that you need to npm install angular-animate and angular-aria, which are normally supplemental libraries to AngularJS but are used by the Material library. You'll need to reference them in your HTML (or just use a CDN) and import them into your Angular module. You'll also need angular-messages, but it looks like you have that installed already.

npm WARN [email protected] requires a peer of angular@>=1.3 <1.7 but none was installed.

That one doesn't really make sense, as you mentioned you have 1.4.7 installed. Sometimes NPM can be a bit inaccurate with its warnings, so I would ignore this unless your app experiences problems. Also, just a thought based on your filepaths...do you have node_modules in a static location or in multiple locations? If multiple, that could cause npm to mess up when it's searching for dependencies.

Collectives™ on Stack Overflow

installing Angular Material in Visual Studio solution

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related