How I used yalc for the local development

This is a bit of a knowledge or experience sharing article.

Intro

There’s a great tool called yalc. It helps to simulate the publish-install-update NPM workflow using a local NPM repo (just a folder on your disk).

Because rescript libraries are installed via NPM, this is a great way to make changes in a dependency and test them locally.

Example

Let’s say, we’re working on an app that uses rescript-react. To test the changes in rescript-react locally, clone the repo, make changes and publish it to yalc:

git clone git@github.com:rescript-lang/rescript-react.git
cd rescript-react
edit src/<file>.res
npm run build
yalc publish
> @rescript/react@0.12.0-alpha.3 published in store.

Now, switch to your app and install rescript-react from yalc:

yalc add @rescript/react
> Package @rescript/react@0.12.0-alpha.3 added ==> /Users/.../.../node_modules/@rescript/react

This will create the following entry in the package.json file:

"@rescript/react": "file:.yalc/@rescript/react"

… and will create a .yalc/@rescript/react directory at the root of your project. Now we can ask yalc to link it into the node_modules

yalc link @rescript/react

… and run the build

npm run res:build
> ...
> Dependency on @rescript/core
> Dependency on @rescript/react
> ...

Next time we make a change in rescript-react, we can just run yalc push and it will update all the places where rescript-react was installed via yalc.

I hope it was helpful.

2 Likes

We use pnpm patch for this (for non-pnpm users there’s patch-package).

Also, it’s useful not only for testing but for production adjustment as well. For example, recently I’ve added support for the relay_resolver.error in rescript-relay.

3 Likes