Dependencies for Angular projects

Demystifying package.json's role and how Angular deals with it

When developing Angular projects, it's a common case to have dependencies for your own project, but… when it comes to the projects on your workspace (libraries and applications), where should you put it? How can you test your libraries or build projects that depends on them?

Package.json's role

package.json (root)
When you create a library or application, they don't have a single dependency, just peerDependencies for Angular. And yet, they use All of Angular's tools as if they had their own node_modules. That's why most, if not all, dependencies from projects (libraries and applications) should be placed here.

projects/project-name/package.json (project)
In most cases, it will only need peerDependencies. If a dependency is needed to run the library, put it in the root package.json and here.

Use your library on your projects

When you create a library with ng generate library my-lib, Angular updates the tsconfig.json and adds a path for your library. This path is the build destination path, so after generating a build of your library like ng build my-lib, you will be able to reference your library like:

import { something } from my-lib;

Whenever you serve (ng serve) or build (ng build) a project that uses one of your libraries, they will follow first the path from tsconfig.json and then node_modules. This makes things easier for testing, and eliminates the need to declare a library as dependency on package.json, but, it also makes the build trickier.

If your projects are independent (don't need to be updated/deployed at the same time), and you built your library in a version ahead of the one you need, when you build your project, it will use the library build instead of the dependency on node_modules. To resolve this you can either make another workspace for this project or make sure the build is deleted before going forward.

Thanks for reading the article! If you liked it, don’t forget to 👏 . It means so much to me and it helps others see this story.

If I forgot anything, there is something to fix, or you have a question, don’t be afraid to post here ✋

Follow me on Twitter (@klauskpm) and on Medium for more updates.