Path Aliases in TypeScript and why you should use them

Well, a normal way to start this article would be talking about path aliases and their story… and once the reader (you) is bored, I would start talking about how to implement them in our beloved projects.

But I hate that kind of post, I like that when I don’t know something (or I don’t remember it), I can just enter the right post in my Google search and find the answer. And later, once I have finished my task, I will just learn more about those concepts (which are interesting but not today’s topic).

So… let’s honor that, and let’s make this post something useful for you.

Path Aliases

The easier way to explain something is with an example. Remember some messy project that you have on your hard drive. One with several components. And even a few components inside one component folder.

Now, remember when you try to import it.

It looks like this, isn’t it?

Did you notice that dots’ nightmare? Imagine if now you could change it to something like this:

That is a path alias! It allows you to reference any file no matter where it is in the project by always using the same “path” (in this case, I set a path alias for the components folder containing my components as…