Importing Angular2 Components with Absolute URLs

Question

Following is the directory structure of a example project:

app
|-components
| |-hero-detail
| | |-hero-detail.component.ts (HeroDetailComponent)
|-services
| |-hero.service.ts (HeroService)

I want to use HeroService in HeroDetailComponent.

Currently I am importing HeroService into HeroDetailComponent using the following statement:

import {HeroService} from '../../services/hero.service'

But I do not like having to refer to HeroService with a relative URL. Instead, I want it to be absolute like this:

import {HeroService} from 'app/services/hero.service'

How would I accomplish that?

Answer 1

You could use the following:

import {HeroService} from '/app/services/hero.service'

assuming that app is a root folder of your Web server.