blogs4t
blogs4t

Reputation: 2737

angular: custom imports - specifying path to file

Is there another way - a better cleaner way to specify the path to my imports? I am referring to the dots and forward slashes

I have something like this:

import { Product } from '../../../../../../@core/model/v2/domain/product';
import { ConfigService } from '../../../../../../@core/data/config.service';
import { ProductMappingContainer } from '../../../../../../@core/model/v2/dto/productMappingContainer';
import { AddProductModalSource } from '../../../../../../@core/model/v2/types/addProductModalSource';

Upvotes: 0

Views: 69

Answers (1)

Engam
Engam

Reputation: 1061

The typescript compiler allows path mapping.

In your tsconfig.json file you can add baseurl:

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

and then in your imports:

import { MyComponent } from '@shared/components/mycomponent'

This is taken from this medium-itnext article

Upvotes: 1

Related Questions