Задача: давайте создадим глубоко вложенный компонент в Angular и сервис, который будет работать с ним. Пример:
ng g component shared/com/core/components/utils/service
Когда у вас есть большой проект Angular с глубоко вложенными файлами и папками, это приводит к операторам импорта, которые выглядят следующим образом…
import { CoreService } from '../../../../../core.service';
Решение — конфигурация TypeScript
Мы можем сделать это возможным, настроив TypeScript на использование пользовательских пространств имен для указания на определенные пути.
{ "compilerOptions": { "baseUrl": "./src", "paths": { "@services": [ "
../../../../../service" ] }, ... }
Затем вы можете указать на любой каталог в вашем проекте и дать ему собственное пространство имен. Любое имя будет работать, но следите за конфликтами имен с существующими пакетами узлов, т. е. @angular
, @ngrx
и т. д. Конечный результат выглядит так…
import { CoreService } from '@services
/core.service';
Ничего особенного, но это один из моих любимых инструментов повышения производительности в Angular. Дайте мне знать, что вы думаете, в комментариях или через Slack.
Предпочтения: