Angular2 - root relative imports
Answer
As of TypeScript 2.0 you can set tsconfig.json properties baseUrl
as following:
{
"compilerOptions": {
"baseUrl": "app"
}
Then, you might use your desired manner of importing components, like:
import { Calendar } from 'components/calendar';
Appendix
Fallback paths resolution
An important consideration is that specifying baseUrl
option causes TypeScript compilator to:
- Look up a path with regards to baseUrl
- On failed resolution (module not found), look up a path with regards to
moduleResolution
option
SystemJS
Since SystemJS is heavily used in Angular development stage, be sure to accordingly config also systemjs.config.js
, so that it resolves paths correctly.
Source and further details: https://github.com/Microsoft/TypeScript/issues/5039
UPDATE
Just don't use this solution. Embrace node module resolution algorithm. Community rests on it, so everything will break apart if you try to do otherwise. Use aliases or some of the other provided solutions.
Short answer
There's a way but you shouldn't do it.
Set the compilerOption "moduleResolution"
to "classic"
.
Long answer
Are you using tsconfig.json
? I assume you are. I've been looking a way to make statements such as import someModule = require ("../../../../someModule"
into import someModule=require("src/path/to/someModule")
.
I found after hours wasted that tsc may use different algorithms for module resolution. I'm using atom and it creates the tsconfig.json
with the compilerOption property moduleResolution
set to "node"
and it uses the shitty (excuse my french) module resolution algorithm of node. I just put "classic" and started working the obvious way.