1

We currently trying to build our next library on angular 9 with Ivy. We have two projects: one corresponding to our library of components, the second corresponding to a " demo " that is used to document/test them. Demo calls the library through node_modules where the library is linked with a symlink.

When we finished to install dependencies of demo, we need to perform: " ngcc && ngcc -s node_modules/ourLibrary --create-ivy-entry-points " to create each ivy_ngcc dir and make our application working.

We can now npm start our demo and live-reload changes. When we make changes into our library and we ng build, it does not automatically trigger changes. If we cut the npm start and restart it, the application launch without error in the terminal, but in the browser console we have: Cannot read property 'id' of undefined. All it's working again if we run ngcc -s node_modules/ourLibrary --create-ivy-entry-points

What happens? When we build again our library, nothing change cause angular probably watch for ivy_ngcc changes : the build generated erase the ivy_ngcc and after the doc doesn't succeed to find it: " Cannot read property 'id' of undefined ". It's why when we re-run the ngcc command, it recreates the dir. But each process it's very time-consuming.

My question is: is there a way to preserve ivy_ngcc during the build of the library? Is the unique solution is to disable ivy that probably not feet our needs?

For information, live-reload with library on a project work very well on angular 7

-- EDIT 1 --

We can probably use --delete-output-path in ng build of the library to try to preserve ivy_ngcc folder, but the option appear to not be available anymore ?

-- EDIT 2 --

--delete-output-path don't work for libraries :

https://github.com/angular/angular-cli/issues/13274

We probably could make our own build command instead of using ng build, but it's become complicated for few benefit of ivy.

KEVIN LOURENCO
  • 17
  • 7

1 Answers1

1

Angular does not recommend to use Ivy with library projects, it doesn't play very well. You will have to disable Ivy for production build at least. You can mention that in tsconfig.lib.prod.json file (or something similar, your filename may vary).

{
  "extends": "./tsconfig.lib.json",
  "angularCompilerOptions": {
    "enableIvy": false
  }
}

I have observed that symlink doesn't always behave consistently, I have always encountered errors. So I prefer to create the zip file locally and then do npm install from the zip file. It's my personal opinion and you don't need to buy that.

Please follow this link:

https://angular.io/guide/creating-libraries#publishing-your-library

For more details, you can follow the below article:

https://indepth.dev/the-angular-ivy-guide-for-library-authors/

GoWin
  • 338
  • 3
  • 15
  • your suggestion is to add the enableIvy false into the library project. We already have this:) But probably the general rule that we have to follow is not " lib project should not use ivy " but : " when something involves building library don't use Ivy " I'm curious if merging --delete-output-path=false with ivy could make sure that ivy_ngcc is not deleted? But probably will not work since changes will probably not occur... – KEVIN LOURENCO Jun 09 '20 at 16:53
  • Then it's a tough ask I would say. :) Maybe [this answer](https://stackoverflow.com/a/58512760/8851497) can provide you some direction. You might have already looked at that. – GoWin Jun 10 '20 at 03:46