title: NPM - Resolving Peer Dependencies in Package.json
body: <p>I’m wondering if I am resolving unmet peer dependencies correctly in my package.json. If I encounter the error, <code>UNMET PEER DEPENDENCY {package@version}</code>, should I install the dependency to “dependencies” or “devDependencies” or does it depend? </p>
  
  <p>I have tried</p>
  
  <pre><code>npm install --save {package}
  </code></pre>
  
  <p>and</p>
  
  <pre><code>npm install --save-dev {package}
  </code></pre>
  
  <p>As a note, I’m running the following after each installation -  </p>
  
  <pre><code>rm -rf ~/.npm
  rm -rf node_modules
  npm cache clean
  npm install  
  </code></pre>
  
  <p>My specific issue is that after running <code>npm install</code>, I have the following unmet peer dependencies under the project root. Only @angular core &amp; common are under another package - </p>
  
  <pre><code>path/to/app
  ├── UNMET PEER DEPENDENCY @angular/animations@4.1.0
  ├── UNMET PEER DEPENDENCY @angular/common@4.1.0 invalid
  ├── UNMET PEER DEPENDENCY @angular/compiler@4.1.0
  ├── UNMET PEER DEPENDENCY @angular/core@4.1.0 invalid
  ├── UNMET PEER DEPENDENCY @angular/platform-browser@4.1.0
  ├── UNMET PEER DEPENDENCY @angular/platform-browser-dynamic@4.0.3
  ├─┬ @swimlane/ngx-charts-dag@1.0.0
  │ ├── UNMET PEER DEPENDENCY @angular/common@~2.4.5
  │ ├── UNMET PEER DEPENDENCY @angular/core@~2.4.5
  ├─┬ UNMET PEER DEPENDENCY d3@4.8.0
  ├── UNMET PEER DEPENDENCY node-sass@^4.0.0
  ├─┬ UNMET PEER DEPENDENCY rxjs@5.3.0
  └── UNMET PEER DEPENDENCY zone.js@0.8.9
  </code></pre>
  
  <p>However, even after installing using either of the following two commands followed by removing the node_modules &amp; cleaning the cache, I still have the unmet dependencies.  </p>
  
  <pre><code>npm install --save-dev @angular/animations @angular/common @angular/compiler @angular/core @angular/platform-browser @angular/common @angular/core d3 less rxjs zone.js
  
  npm install --save @angular/animations @angular/common @angular/compiler @angular/core @angular/platform-browser @angular/common @angular/core d3 less rxjs zone.js
  </code></pre>
  
  <p>So most importantly, is my approach to installing the UNMET dependencies correct? And if someone knows a fix for my issue, I’d appreciate it.</p>
  
  <p>EDIT:
  Using npm version 4.2.0 and here are my dependencies with the right ngx-charts-dag version- </p>
  
  <pre><code>  "dependencies": {
      "@angular/animations": "~4.0.3",
      "@angular/common": "~4.0.3",
      "@angular/compiler": "~4.0.3",
      "@angular/core": "~4.0.3",
      "@angular/platform-browser": "~4.0.3",
      "@angular/platform-browser-dynamic": "~4.0.3",
      "d3": "4.8.0",
      "@swimlane/ngx-charts-dag": "^2.0.0",
      "rxjs": "5.3.0",
      "zone.js": “0.8.9”,
      …
    }
  </code></pre>
  
  <p>I'm still seeing unmet peer dependency issues under the root of the project with the exact version in the package.json -</p>
  
  <pre><code>├── UNMET PEER DEPENDENCY @angular/common@4.0.3
  ├── UNMET PEER DEPENDENCY @angular/compiler@4.0.3
  ├── UNMET PEER DEPENDENCY @angular/core@4.0.3
  ├── UNMET PEER DEPENDENCY @angular/platform-browser@4.0.3
  ├── UNMET PEER DEPENDENCY @angular/platform-browser-dynamic@4.0.3
  ├─┬ UNMET PEER DEPENDENCY d3@4.8.0
  ├─┬ UNMET PEER DEPENDENCY rxjs@5.3.0
  └── UNMET PEER DEPENDENCY zone.js@0.8.9
  </code></pre>
  
  <p>EDIT2: 
  Some fixes provided by Mitch removed the unmet peer dependencies for rxjs@5.3.0 &amp; zone.js@0.8.9. These are caused by deprecated "ng2d3", which has moved to ngx-charts. "angular2-google-maps" also has an unmet peer dependency for zone.js@0.8.9. What's still puzzling is that I receive the following UNMET PEER DEPENDENCIES after removing "ng2d3" and "angular2-google-maps"</p>
  
  <pre><code>├── UNMET PEER DEPENDENCY @angular/animations@4.0.3
  ├── UNMET PEER DEPENDENCY @angular/common@4.0.3
  ├── UNMET PEER DEPENDENCY @angular/compiler@4.0.3
  ├─┬ UNMET PEER DEPENDENCY @angular/compiler-cli@4.1.0
  ├── UNMET PEER DEPENDENCY @angular/core@4.0.3
  ├── UNMET PEER DEPENDENCY @angular/platform-browser@4.0.3
  ├── UNMET PEER DEPENDENCY @angular/platform-browser-dynamic@4.0.3
  ├─┬ UNMET PEER DEPENDENCY d3@4.2.2
  ├─┬ UNMET PEER DEPENDENCY webpack@2.5.0
  </code></pre>
  
  <p>These match the exact versions specified in my package.json - </p>
  
  <pre><code>  "dependencies": {
      "@angular/animations": "4.0.3",
      "@angular/common": "4.0.3",
      "@angular/compiler": "4.0.3",
      "@angular/compiler-cli": "4.1.0",
      "@angular/core": "4.0.3",
      "@angular/platform-browser": "4.0.3",
      "@angular/platform-browser-dynamic": "4.0.3",
      "d3": "4.2.2"
    },
    "devDependencies": {
      "webpack": "2.5.0",
    }
  </code></pre>