spartacus VS ng-packagr

I was struggling to find out why the Angular Universal SSR was hanging in my app. I knew it had to be some pending async task that prevented the SSR from completion, but it was hard to guess which one. So I googled how to track async tasks in Angular and I learnt about the plugin zone.js/plugins/task-tracking. Thanks to this plugin, I quickly located the faulty line in the code and fixed the hanging SSR in the app.

When I heard that SAP is working on Spartacus - a storefront framework based on Angular - I was super excited and couldn't wait to try it out. In fact, I had the privilege to work on one of the first Spartacus integration for the high street beauty brand. I must admit it was challenging. The new storefront (Spartacus) that was based on a framework (Angular) that has a steep learning curve, poor documentation and lack of a wider community around it didn't make things any easier.

Here's a fix of the above error in the real world library (when running yarn build:libs).

Let’s add this folder, and all files in it, to the ng-package.json file of the library. You can find more information here about why we should declare this assets property.

Additionally, to create a new library for each piece you want to share, you could use the Secondary entrypoints feature of ng-packagr to group common things together, like components or services, and group them together by a more specific feature. But consider this will requires additional updates to the configuration.

ng-packagr repo (link)

Specifically for Angular, we have the Angular Package Format, which is produced by the CLI or by the standalone ng-packagr tool.

ng-packgr will build the entry points in the following order: