Angular, Nrwl, and Typescript

I have been playing around with mono-repo at work. We use lerna to manage the workspace (our project is not an Angular project). Playing with the mono repo at work helped me to better understand the workspace structure recommended with the Angular CLI when you want sharable libraries. https://angular.io/guide/creating-libraries

In exploring mono-repos and Angular, the nx command line tool from NRWL keeps cropping up, so I decided to take it for a ride.

After a very swift migration from the ng structure, I fell in love.

The nx command line tool is an enhanced wrapper for Angulars ng command line tool. It provides repo management commands on top of enhanced ng commands.

I had some issues creating libraries in subdirectories, so I reverted to a different organization structure: I create a library, then update the directory with a prefix (component, lib, store, directive…)

This requires me to update the path in angular.json, update the path in the root tsconfig.ts, and update any references in the library’s own index.ts (I found that if I use Webstorms refactor feature to rename the library directory tsconfig.ts got updated.)

This structure groups the libraries while still keeping a flat structure.

This helps me to navigate to the designed library more quickly.

We will see how it stands the test of time.

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.