Path Aliases

Declared in tsconfig.json with baseUrl: "src".

"paths": {
    "@pyb-core/*":         ["app/core/*"],
    "@pyb-views/*":        ["app/views/*"],
    "@pyb-environments/*": ["environments/*"],
    "@pyb-assets/*":       ["assets/*"],
    "@pyb-components/*":   ["app/views/partials/components/*", "app/core/pyb/components/*"],
    "@pyb-modals/*":       ["app/views/partials/modals/*"],
    "@pyb-vendors/*":      ["app/vendors/*"],
    "@pyb-tests/*":        ["../tests/*"]
}
Alias Resolves to Typical import

@pyb-core/*

src/app/core/*

@pyb-core/pyb/services/permissions.service

@pyb-views/*

src/app/views/*

@pyb-views/pages/reports/reports.service

@pyb-environments/*

src/environments/*

@pyb-environments/environment.service

@pyb-assets/*

src/assets/*

@pyb-assets/i18n/en

@pyb-components/*

src/app/views/partials/components/ then src/app/core/pyb/components/

@pyb-components/grid/grid.module

@pyb-modals/*

src/app/views/partials/modals/*

@pyb-modals/message-modal

@pyb-vendors/*

src/app/vendors/*

@pyb-vendors/cloud-watch/cloud-watch.service

@pyb-tests/*

tests/* (repository root, outside src)

@pyb-tests/helpers/store.mock
@pyb-components maps to two directories

TypeScript tries app/views/partials/components/ first and falls back to app/core/pyb/components/. Two consequences:

  • A folder name existing in both locations silently resolves to the partials copy. Adding grid/ under views/partials/components/ would shadow the core grid module used across every report.

  • Jumping to definition can land in the wrong tree. Check the resolved path when something imports differently than expected.

Usage rules

Never use a relative import across module boundaries. Relative paths are only acceptable within the same folder or to a direct child.

 
// good
import { PermissionsService } from '@pyb-core/pyb/services/permissions.service';
import { WelcomeModalComponent } from '@pyb-modals/welcome-modal/welcome-modal.component';
import { CloudWatchService } from '@pyb-vendors/cloud-watch/cloud-watch.service';

// good — sibling file in the same feature folder
import { reducer } from './balance.reducer';

// bad
import { PermissionsService } from '../../../../core/pyb/services/permissions.service';

Barrels

Prefer the barrel where one exists:

@pyb-core/auth

User, AuthService, guards, selectors, Permission.

@pyb-core/pyb/services

PersistentStateManager, UserService, TwoFactorSetupBannerInitializerService, SupportHelperService.

@pyb-core/pyb/features

Feature slice exports.

@pyb-core/pyb/entities

Entity slice exports.

@pyb-core/pyb/constants

Shared constants.

@pyb-core/pyb/services/index.ts re-exports only four of the ~40 services in that folder. Everything else must be imported by its full path — the barrel is not a complete surface.

Non-aliased packages

Two Payability packages are consumed as ordinary npm dependencies:

@payability/pyb-ng2-api

Generated API services, DTOs, models and shared enums (SupplierStatusType, AdvanceLineStatusEnum, DocusignEventTypeEnum, CrossSellProductEnum, …).

@payability/pyb-ngx-components

The shared UI kit (PybDialogService, PybToastService, PybButtonType, PybColorPalette, form and grid modules).

Adding an alias

  1. Add the mapping to compilerOptions.paths in tsconfig.json.

  2. Restart the TypeScript server — editors cache path mappings.

  3. Check tsconfig.app.json, tsconfig.spec.json and tsconfig.eslint.json extend the root config so the alias applies to builds, tests and lint alike.