CODEWITHSUNDEEP
angulartypescript
Tomas
Tomas

Reputation: 3436

Angular 2 paths setting

For what keyword should I look to learn how to configure my Angular app to be able to load my internal modules with following:

import { MyModule } from 'cool/short/path';

instead of:

import { MyModule } from './../../../modules/MyModle/my-module';

I went through some tutorial mentioning how to configure whole app to use some kind of absolute path marking, but is it possible to configure single module in such manner? As a notable example I'd mention Angular modules, which are always referred with @ and same path from whatever project location.

Upvotes: 1

Views: 225

Answers (2)

Tomas
Tomas

Reputation: 3436

OP here again, I'd like to mention one important gotcha in "non-relative paths". As Igor Soloydenko answer mentions tsconfig.json file, for myself it worked correctly after modifying tsconfig.app.json file, which in fact extends base tsconfig.json, but even though only working from app file level my changes were effective.

Upvotes: 0

Igor Soloydenko
Igor Soloydenko

Reputation: 11825

I think, what you're asking is a property of TypeScript compiler options. Look at this document describing baseUrl.

Since we're talking about import ... instruction, it's unrelated to Angular. You'll need to set it in your tsconfig.json file.

Your "non-relative paths" (those without ..) will be resolved starting the baseUrl. So, technically, they are still relative. The difference is instead of being relative to the current file, they will be relative to the directory you specified. You will still be able to use ..-based imports if you want. You can even mix the import styles within the same file...

Upvotes: 3

Related Questions