Короткие пути к файлам (path mapping в typescript)

Зачастую в иерархической структуре сайта типичны такие длинные относительные урлы как:

import { AuthCodeComponent } from './components/session/auth-code/auth-code.component';

Было бы здорово их укоротить и вообще сделать абсолютным, например :

import { AuthCodeComponent } from '@session/auth-code/auth-code.component';

Это не только приятно зрительно, но и упрощает подключение одних и тех же сущностей Angular в разных проектах.
Также удобно подключать файлы в различных папках приложения одним способом.

И это возможно с помощью typescript path mapping.

Для этого в корневом файле проекта tsconfig.json прописываем

"compilerOptions": { 
  "baseUrl": "./src", 
  "paths": { 
    "@session/*": ["app/components/session/*"] 
  } 
 }

В результате полный путь к файлу = baseUrl + «app/components/session/*».

Если же вы используете для тестов jest, то понадобиться прописать в его настройках в файле package.json:

"jest": { 
  "moduleNameMapper": { 
    "@session/(.*)": "/src/app/shared/$1" 
  } 
}

Работает на версиях

"@types/jest": "^22.2.3",
"jest": "^22.4.4",
"jest-preset-angular": "^5.2.2"