title: Angular 4 Component Won't Import Typing
body: <p>I have a simple component that won't compile because of a typing issue.</p>
  
  <p><strong>Component</strong></p>
  
  <pre><code>import { Component, Input } from '@angular/core';
  import { DriveItem } from '@microsoft/microsoft-graph-types';
  import { getType, DriveItemType } from '../../helpers/graphItem.helper';
  
  @Component({
      selector: 'app-selected-item',
      templateUrl: './selected-item.component.html',
      styleUrls: ['./selected-item.component.scss']
  })
  export class SelectedItemComponent {
  
      @Input() selectedItem: DriveItem;
      @Input() deselectItem: Function;
  
      constructor() { }
  
      itemType(item: DriveItem): DriveItemType {
          return getType(item);
      }
  }
  </code></pre>
  
  <p>The error is happening with the <code>DriveItem</code> type. I've used this elsewhere in my project with no issues, but for some reason it will not resolve correctly in this component.</p>
  
  <p><strong>Error</strong></p>
  
  <pre><code>ERROR in ./src/app/components/selected-item/selected-item.component.ts
  Module not found: Error: Can't resolve '@microsoft/microsoft-graph-types' in '/Users/jack/repos/project/src/app/components/selected-item'
  resolve '@microsoft/microsoft-graph-types' in '/Users/jack/repos/project/src/app/components/selected-item'
  Parsed request is a module
  using description file: /Users/jack/repos/project/package.json (relative path: ./src/app/components/selected-item)
      Field 'browser' doesn't contain a valid alias configuration
  after using description file: /Users/jack/repos/project/package.json (relative path: ./src/app/components/selected-item)
      resolve as module
      /Users/jack/repos/project/src/app/components/selected-item/node_modules doesn't exist or is not a directory
      /Users/jack/repos/project/src/app/components/node_modules doesn't exist or is not a directory
      /Users/jack/repos/project/src/app/node_modules doesn't exist or is not a directory
      /Users/jack/repos/project/src/node_modules doesn't exist or is not a directory
      /Users/jack/repos/node_modules doesn't exist or is not a directory
      /Users/jack/node_modules doesn't exist or is not a directory
      /Users/node_modules doesn't exist or is not a directory
      /node_modules doesn't exist or is not a directory
      looking for modules in /Users/jack/repos/project/node_modules
          using description file: /Users/jack/repos/project/package.json (relative path: ./node_modules)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./node_modules)
          using description file: /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/package.json (relative path: .)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types is not a file
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              existing directory
                  using path: /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index
                  using description file: /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/package.json (relative path: ./index)
                      no extension
                      Field 'browser' doesn't contain a valid alias configuration
                      /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index doesn't exist
                      .ts
                      Field 'browser' doesn't contain a valid alias configuration
                      /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index.ts doesn't exist
                      .js
                      Field 'browser' doesn't contain a valid alias configuration
                      /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index.js doesn't exist
      looking for modules in /Users/jack/repos/project/node_modules
          using description file: /Users/jack/repos/project/package.json (relative path: ./node_modules)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./node_modules)
          using description file: /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/package.json (relative path: .)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types is not a file
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              existing directory
                  using path: /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index
                  using description file: /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/package.json (relative path: ./index)
                      no extension
                      Field 'browser' doesn't contain a valid alias configuration
                      /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index doesn't exist
                      .ts
                      Field 'browser' doesn't contain a valid alias configuration
                      /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index.ts doesn't exist
                      .js
                      Field 'browser' doesn't contain a valid alias configuration
                      /Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index.js doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
      looking for modules in /Users/jack/repos/project/src
          using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          Field 'browser' doesn't contain a valid alias configuration
          after using description file: /Users/jack/repos/project/package.json (relative path: ./src)
          using description file: /Users/jack/repos/project/package.json (relative path: ./src/@microsoft/microsoft-graph-types)
              no extension
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
              .ts
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts doesn't exist
              .js
              Field 'browser' doesn't contain a valid alias configuration
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js doesn't exist
              as directory
              /Users/jack/repos/project/src/@microsoft/microsoft-graph-types doesn't exist
  [/Users/jack/repos/project/src/app/components/selected-item/node_modules]
  [/Users/jack/repos/project/src/app/components/node_modules]
  [/Users/jack/repos/project/src/app/node_modules]
  [/Users/jack/repos/project/src/node_modules]
  [/Users/jack/repos/node_modules]
  [/Users/jack/node_modules]
  [/Users/node_modules]
  [/node_modules]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index.ts]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index.js]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index.ts]
  [/Users/jack/repos/project/node_modules/@microsoft/microsoft-graph-types/index.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.ts]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types.js]
  [/Users/jack/repos/project/src/@microsoft/microsoft-graph-types]
  @ ./src/app/components/selected-item/selected-item.component.ts 11:0-61
  @ ./src/app/app.module.ts
  @ ./src/main.ts
  @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
  
  webpack: Failed to compile.
  </code></pre>
  
  <p>I thought that it might be because I added a new directory called <code>components</code> and this file lives there, but I have no way of knowing if that's the issue.</p>
  
  <p><strong>Folder Structure</strong></p>
  
  <pre><code>/src
      /app
          /components
              /selected-item
                  - selected-item.component.ts &lt;-- This file will not resolve DriveItem type
          /helpers
              - graphItem.helper.ts &lt;-- DriveItem type works fine here
          /pages
              /home
                  - home.component.ts &lt;-- DriveItem type also works fine here.
  </code></pre>
  
  <p>So far I've tried the following:</p>
  
  <ul>
  <li>Install the latest version of Angular CLI</li>
  <li>Deleted node modules, cleaned cache, re-installed.</li>
  <li>Attempted different variations of the the import <code>* as MicrosoftGraph</code> versus <code>{ DriveItem } from</code></li>
  <li>Removed the types and just use <code>any</code>. It's worth noting that I can import the <code>DriveItem</code> type, but the compilation only fails if I try to use it.</li>
  </ul>