Using yarn link to develop a library locally

Introduction

Imagine you are a web developer, and you have your own libraries that are used in your application. Separating specific features as a library package has a lot of advantages.

For example, let’s say we have a library for chat messages..

Isolating chat features in a separate project and building it as a library will make it easier to maintain and will be more flexible to use in our app ecosystem.

But there’s one question..

When we develop a new feature for that library, how can we make sure that our new feature is integrated well with other projects as expected, without waiting for the package to be published? Since this package needs to be released first then we can integrate it into our main application.

The answer is pretty simple, we just need to build our package locally!

What does ‘build locally’ mean?

Instead of publishing our package, we can utilize yarn link command and run it in the package directory. By doing this, we’ll register our package locally.

After that, we just need to go to our main application directory and run yarn link "packageName" , this process will create a symlink to our local copy that will be resolved before the copy is installed by yarn.

common package import

Our app linked to our local version of the library

Sample Case

Let’s say in Mamikos we have a package library called Mamichat.

In development phase, the package needs to be tested first before we can release it so we don’t break the existing feature and integrate well within our main application.

How can we do it?

First, we must register our library to be recognized as the global package locally that will be used in our main project. We can just run yarn link inside this package repository.

Make sure we build our package with yarn build first, another application will use the build directory as their source.

After that, we can use this package in our main application, we just need to run yarn link "packageName" in the main app repository.

Then, we must force re-install all the packages with yarn install --force in our main application.

WARNING: if you run yarn, this link might disappear, you’ll need to run yarn link "packageName" again and re-install the package with the above command.

The defined package will be using local files and ignoring to pull from the package’s server. With this approach, We can integrate and test our library in our main application without any doubt. If there’s any bug, we just need to fix it and rebuild the package to get the update. (no need to do yarn link process again).

Don’t forget to unlink

After the development process and our package are ready to release, don’t forget to unlink the local package from the project. To do this, we can just run yarn unlink "packageName" in our application.

And if we want to unregister the package locally, just run yarn unlink inside the package repository.

This process will invalidate the link status of our package in any other project and will reject local pull when they run yarn install again.

Conclusion

It’s really important to test our library package locally, so we can ensure the integration will not fail with other apps that use it. By using the yarn link command, we can easily achieve a configuration that allows us to test our packages in a local environment, saving time from making for pre-release test versions to check the integration.

I hope this article will give you some insight. 😉