🐞 bug report

Affected Package

ng-packagr

Is this a regression?

Description

Possible duplicate of #35331, #34983, #35255, and #30972, but I'm including a minimal reproduction repo. Building with IVY throws the following error (see the Exception or Error section)

Our real app, which uses a shared module, throws a slightly different error:

Running the ng-packagr postinstall script adds "ivy_ngcc" folders to some of our other dependencies, but does not touch the angular2-highcharts library. The library does not use the Angular Package Format, which might be part of the problem, but I'm not the library's author and have never built an ES6/angular library myself, so I'm just guessing at a potential fix.

Unfortunately, the library is no longer maintained, but it is one of our app's core/major dependencies. I also attempted to rebuild the library from the source files after adding the following to the library's package.json file:

"postinstall": "ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points",
"ngPackage": {
  "lib": {
    "entryFile": "index.d.ts"
  }
},

But this produces the following error:

There is no "files" array provided in the library's package.json file, so I'm not sure what the error is referring to. I fixed all Angular 9-related issues prior to re-building the library, so I assume it has to do with the way it's packaged or how it exports the modules/components.

🔬 Minimal Reproduction

StackBlitz
https://angular-ivy-cant-be-resolved.stackblitz.io

GitHub repo in case StackBlitz isn't working:
https://github.com/stevethemacguy/angular-ivy-cant-be-resolved-bug

Steps to Reproduce

1. Download or clone the repo
2. npm install
3. ng build (or ng serve)

Expected behavior: IVY builds the app
Actual behavior: IVY displays an error.

🔥 Exception or Error

ERROR in node_modules/angular2-highcharts/dist/index.d.ts:8:22 - error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class

8 export declare class ChartModule {

🌍 Your Environment

Angular Version:

Angular CLI: 9.0.2
Node: 10.15.3
OS: darwin x64

Angular: 9.0.1
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.2
@angular-devkit/build-angular     0.900.2
@angular-devkit/build-optimizer   0.900.2
@angular-devkit/build-webpack     0.900.2
@angular-devkit/core              9.0.2
@angular-devkit/schematics        9.0.2
@angular/cli                      9.0.2
@ngtools/webpack                  9.0.2
@schematics/angular               9.0.2
@schematics/update                0.900.2
rxjs                              6.5.4
typescript                        3.7.5
webpack                           4.41.2

Anything else relevant?
After disabling IVY, our real app successfully builds in AOT (prod mode) using Angular 9.0.1, so the issue seems to be an Angular regression that is un-related to our app (except for the angular2-highcharts dependency). Our app uses a custom angular/webpack build. It does not use Angular CLI.

Not sure this will provide anyone relief or assist with figuring out what the root cause is, but cleaning my cache seemed to help resolve the issue.
npm cache clean --force

The only other step that I did was I ran a --prod serve after the clean.
ng serve --prod

I do not know if the clean or --prod thing had anything to do with fixing it for me, or if maybe the combination of them did anything, but I can no longer repro this bug in my project. Note, I can run without --prod and still have successful builds going forward.

Other than that, I saw this first when adding HttpClientModule as I was going through the tour of heroes tutorial.

Disabling Ivy does work but then what's the point of upgrading to angular 9?
From what I understand, Ivy is THE big update of version 9...

Hello,
I have the same problem in my poject "NX monorepo project",

• "importHelpers": true didnot help

• "enableIvy": false for the libs and "enableIvy": true for the demo project that inject the libs dinot work either.

Any suggestions please ^^
regards.

For those who "importHelpers": true didn't solve the problem and are using yarn workspaces:

You need to specify the node_module folder in the postinstall script.

Ex: If you have a workspace with the angular project in packages/client/package.json you have to set the postinstall script to:
ngcc --source ../../node_modules --properties es2015 browser module main --first-only --create-ivy-entry-points

For more options you can go [here].(https://github.com/angular/angular/blob/master/packages/compiler-cli/ngcc/main-ngcc.ts#L20)

Hi @stevethemacguy ,

I just encountered the same issue and was able to track it down to one property in the tsconfig.json:
Ensure that the tsconfig.json of your library has set "importHelpers": true

What I tried with importHelper in their corresponding tsconfig.json:

Cheers
flash ⚡️