title: Importing Angular2 Components with Absolute URLs
body: <p>Following is the directory structure of a example project:</p>
  
  <pre><code>app
  |-components
  | |-hero-detail
  | | |-hero-detail.component.ts (HeroDetailComponent)
  |-services
  | |-hero.service.ts (HeroService)
  </code></pre>
  
  <p>I want to use <code>HeroService</code> in <code>HeroDetailComponent</code>.</p>
  
  <p>Currently I am importing <code>HeroService</code> into <code>HeroDetailComponent</code> using the following statement:</p>
  
  <pre><code>import {HeroService} from '../../services/hero.service'
  </code></pre>
  
  <p>But I do not like having to refer to <code>HeroService</code> with a relative URL. Instead, I want it to be absolute like this:</p>
  
  <pre><code>import {HeroService} from 'app/services/hero.service'
  </code></pre>
  
  <p>How would I accomplish that?</p>