How to add Alias's / Paths in Typescript & Gatsby

A step by step tutorial for adding alias's and paths to Typescript & Gatsby. Includes an open source Github starter project.

Oscar de la Hera Gomez
Written by Oscar de la Hera Gomez
First published on 06/29/2022 at 11:30
Last Updated on 09/13/2022 at 12:51
A flower that represents Typescript next to one that represents Gatsby. The word's alias's and paths sit below.

A step by step tutorial for adding alias's and paths to Typescript & Gatsby. Includes an open source Github starter project.

Check out our step by step guide for creating a Gatsby - Typescript projectDownload Starter Project

Step One: Create or Update your gatsby-node.js

A screenshot on what a gatsby-node.js file looks like for a 'component' alias. Gist below.

The sample below shows how to add the components alias/path on line 8.

Step Two: Update your tsconfig.json

A screenshot of what the tsconfig.json looks like. Available in the gist below.

The sample below shows how to add the components alias/path on line 16.

Any Questions

We are actively looking for feedback on how to improve this resource. Please send us a note to inquiries@delasign.com with any thoughts or feedback you may have.

SubscribeInquireView All PostsView All ServicesView All Work

Partner with us

We would love to get to know you and see how we can help your organization with its goals and needs.
Let's Talk

Stay Informed

Get occasional updates about our company, research, and product launches.
Subscribe