Load Local Node Packages as Dependencies

Loading a local Node package into multiple local projects can be beneficial to your development process.

Let’s call the project and the package we are going to work with my-local-project and my-local-package for the purpose of this post. We’re going to load the my-local-package into the project as a dependency.

Usually you would execute a Node install that loads a package from the NPMJS.org registry:

npm install package-name@version

That will include and autoload the Node package into your project. That is from the remote registry but you don’t have to publish your package there during development, you can load them locally.

Here are two ways of loading a local Node package into your project. The first way is the standard way of doing it while the second way will simplify and automate the process for you. No 2 is the updated and recommended way of streamlining development.

1. NPM install Local Package

To install a local Node package in your project, you can just specify a relative path to the package directory. In your my-local-project folder, run this command:

npm install ../my-local-package

Which results a relative, local file reference in your package.json file. When you update the Node package source code, you need to build it again and update the project to load the newly built dependency locally.

To re-build the package, go to it and run:

npm run build

This works perfectly good and is extremely useful in development and testing phases of a project.

If the package has new dependencies, you need to run an install on the project:

npm install

Or rather just do this in the project:

npm update my-local-package

Each time you make changes, you need to rebuild the package and restart your project which can be tedious. Let’s see how we can automate this and automatically load package changes into the project without having to do anything.

2. Use Yalc to Add Local Package

Not only does Yalc help you to use a package across multiple local projects – it also allows the automation of pushing changes to the package to all projects.

Automate the loading of a local package changes into projects

We can even automate this process so that changes to the package are automatically pushed. That way you can focus on the implementation of the project and it’s dependencies.

Follow these steps to load a local Node package into your project and automate the pushing of changes in the package to the project:

2.1. Setup Yalc in the Package

First off, install Yalc globally:

npm install -g yalc

That will install Yalc globally on your machine. Yalc has a local store on your machine to which you can publish packages and from where you can load packages.

When it’s done, you can go to the package’s folder and then publish to the Yalc store:

yalc publish

2.2. Add Yalc to the Project

With the package published to your Yalc store, you can now use it as a dependency in other projects. To add it to your project, go to the project’s folder in your command line or terminal and execute this command:

yalc add my-local-package

Then do an install if your package has dependencies of it’s own:

npm install

That’s it, you can now use the package’s code and logic in your project by importing it’s class exports.

At this point, you can make changes to your local package and just execute a yalc publish --push command to run a build on the package and push the changes to your local project/s where you added the package from the Yalc store.

Try it out – Make a change to your package, run the command and test the code in your project/s.

Let’s automate this so that changes in the package automatically runs the build and publish command and also in your project, restart the application or run an install for the dependencies.

2.3. Setup Nodemon

Nodemon will automatically detect changes to the package and project files. In this case, we want to run some commands when changes are detected.

2.3.1. Nodemon in the Package

Let’s say the source files in your package is inside src/ we want to watch all changes to files in this directory and run the yalc publish --push command when there are changes.

Install Nodemon in your package as a development dependency with the following command:

npm install --save-dev nodemon

Then in the root of your project – same level as the Node package.json file, create a new file named nodemon.json and paste the following configuration into it:

{
  "restartable": "rs",
  "ignore": [".git", "dist/", "coverage/"],
  "watch": ["src/"],
  "execMap": {
    "ts": "node -r ts-node/register"
  },
  "env": {
    "NODE_ENV": "development"
  },
  "ext": "js,json,ts"
}

Start Nodemon with the following command in your package:

nodemon -e js,ts -x yalc publish --push

Then start making changes to your package and watch the application run the command automatically to build and push the changes to all local projects using the package.

2.3.2. Nodemon in the Project

Install Nodemon in your project as well using the same command as above.

Also create a nodemon.json configuration file in the project. The configuration will be a little bit different since we want to watch for changes on the package folder inside the project and restart the application or run a command. Here is the configuration file’s content:

{
  "restartable": "rs",
  "ignore": [".git"],
  "watch": ["src/", "node_modules/my-local-package/"],
  "execMap": {
    "ts": "node -r ts-node/register"
  },
  "env": {
    "NODE_ENV": "development"
  },
  "ext": "js,json,ts"
}

The package lives inside the node_modules folder. That is done by Yalc itself. So let’s watch the package folder in there using Nodemon.

Start it up with the following command:

npm run dev

That will run Node and execute the Nodemon watch as well. Once you’ve run it, make changes to the package and let it run it’s build and push. Then watch the project restart due to the changes in the node_modules/my-local-package/ folder.

2.4. Test It Out

Since you have Nodemon running on the project and also on the package, make a change to any of the package files and watch the magic happen 🙂

As you make changes the package, Nodemon will pick it up and run the build as well as the Yalc push command to your local project folder/s. Then Nodemon in the project will pick up the changes to node_modules/my-local-package and also rebuild.

Be the first to reply

Leave a Reply

Your email address will not be published. Required fields are marked *