Angular CLI has webpack built-in, so path aliases can be configured. The configuration method is almost the same.

Configure Path Alias

Find the tsconfig.json file in your project root directory.

Note: If your configuration doesn’t take effect, check if your baseUrl is configured correctly.

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

Before Configuration

import { Api } from '../../../../../services/api.service';
import { xxx } from '../../../../../services/api.xxx';

After Configuration

import { Api } from '@services/api.service';
import { xxx } from '@services/api.xxx';

Some development tips, hope this helps you.

Article Link: