question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. ItĀ collects links to all the places you might be looking at while hunting down a tough bug.

And, if youā€™re still stuck at the end, weā€™re happy to hop on a call to see how we can help out.

ngcc - failing to compile dependencies and own libraries with secondary entries

See original GitHub issue

šŸž bug report

Affected Package

@angular/compiler-cli - ngcc

Description

In a medium sized monorepo, containing libraries with secondary entries the ngcc seems to fail to properly compile local libraries. The example exception is in the Exception or Error section.

The triggered command:

main-ngcc.js
    --properties es2015 browser module main
    --first-only
    --create-ivy-entry-points
    --source <PATH-TO-NODE_MODULES>
    --tsconfig ./tsconfig.base.json

Current workaround:

  • Trigger ngcc before any library is built
  • Build all the libraries
  • Trigger ngcc on ./dist instead of node_modules

šŸ”¬ Minimal Reproduction

I tried to create small reproduction and didnā€™t succeed. If the above description is not enough I will try once again with creating the same structure as we have in our monorepo - itā€™s a bigger effort.

šŸ”„ Exception or Error

Compiling @angular/core : es2015 as esm2015
Compiling @angular/cdk/keycodes : es2015 as esm2015
Compiling @angular/animations : es2015 as esm2015
Compiling apollo-angular-link-persisted : es2015 as esm2015
Compiling @demo/library1/secondary1 : es2015 as esm2015
Compiling @angular/compiler/testing : es2015 as esm2015
Compiling @angular/service-worker/config : es2015 as esm2015
Compiling @angular/cdk/observers : es2015 as esm2015
Compiling @angular/common : es2015 as esm2015
Compiling @angular/animations/browser : es2015 as esm2015
Compiling @angular/cdk/collections : es2015 as esm2015
Compiling apollo-angular : es2015 as esm2015
Compiling @angular/cdk/platform : es2015 as esm2015
Compiling @angular/cdk/bidi : es2015 as esm2015
Compiling @angular/platform-browser : es2015 as esm2015
Compiling @angular/forms : es2015 as esm2015
Compiling @angular/cdk/a11y : es2015 as esm2015
Compiling @angular/platform-browser/animations : es2015 as esm2015
Compiling @angular/cdk/scrolling : es2015 as esm2015
Compiling @angular/common/http : es2015 as esm2015
Compiling @angular/material/core : es2015 as esm2015
Compiling @angular/cdk/portal : es2015 as esm2015
Compiling @angular/router : es2015 as esm2015
Compiling @angular/material/button : es2015 as esm2015
Compiling @angular/cdk/overlay : es2015 as esm2015
Compiling @angular/material/form-field : es2015 as esm2015
Compiling @angular/material/icon : es2015 as esm2015
Compiling apollo-angular-link-http-common : es2015 as esm2015
Compiling @angular/flex-layout/core : es2015 as esm2015
Compiling @angular/material/divider : es2015 as esm2015
Compiling apollo-angular-link-http : es2015 as esm2015
Compiling @ag-grid-community/angular : es2015 as esm2015
Compiling @angular/material/select : es2015 as esm2015
Compiling @demo/library1 : es2015 as esm2015
Compiling @angular/cdk/text-field : es2015 as esm2015
Compiling @ng-action-outlet/core : es2015 as esm2015
Compiling @angular/flex-layout/extended : es2015 as esm2015
Compiling @angular/flex-layout/flex : es2015 as esm2015
Compiling @angular/flex-layout/grid : es2015 as esm2015
Compiling @angular/material/dialog : es2015 as esm2015
Compiling @angular/material/input : es2015 as esm2015
Compiling @angular/flex-layout : es2015 as esm2015
Compiling @angular/material/toolbar : es2015 as esm2015
Compiling @angular/material/datepicker : es2015 as esm2015
Compiling @angular/material/button-toggle : es2015 as esm2015
Compiling @angular/material/checkbox : es2015 as esm2015
Compiling @angular/material/chips : es2015 as esm2015
Compiling @angular/material/autocomplete : es2015 as esm2015
Compiling @angular/material/progress-spinner : es2015 as esm2015
Compiling @angular/material/list : es2015 as esm2015
Compiling @angular/material/badge : es2015 as esm2015
Compiling @angular/elements : es2015 as esm2015
Compiling @angular/material/sidenav : es2015 as esm2015
Compiling @angular/cdk/layout : es2015 as esm2015
Compiling @demo/library1/secondary2 : es2015 as esm2015
Compiling @demo/library2/some-pipe : es2015 as esm2015
Compiling @demo/library3 : es2015 as esm2015
Compiling @angular/cdk/tree : es2015 as esm2015
Compiling @angular/material/menu : es2015 as esm2015
Compiling @angular/material/card : es2015 as esm2015
Compiling @angular/material/tree : es2015 as esm2015
Compiling @demo/library2/entry/fancy-component : es2015 as esm2015
Compiling @demo/library2/entry/another-component : es2015 as esm2015
Compiling @demo/library3 : es2015 as esm2015
Compiling @demo/library2/entry/boring-component : es2015 as esm2015
Compiling @demo/library2/entry/yet-another-component : es2015 as esm2015
Error: Failed to compile entry-point @demo/library3 (es2015 as esm2015) due to compilation errors:

dist/library2/some-pipe/some-pipe.module.d.ts:1:22 - error NG6002: Appears in the NgModule.imports of Library3Module, but could not be resolved to an NgModule class.

This likely means that the dependency (@demo/library2/some-pipe) which declares SomePipeModule has not been processed correctly by ngcc.

1 export declare class SomePipeModule {
                       ~~~~~~~~~~~~~~~~~

šŸŒ Your Environment


Angular CLI: 10.0.2
Node: 12.18.2
OS: darwin x64

Angular: 10.0.3
... animations, common, compiler, compiler-cli, core
... platform-browser, platform-browser-dynamic
Ivy Workspace: <error>

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.1000.2
@angular-devkit/build-angular      0.1000.2
@angular-devkit/build-ng-packagr   0.1000.2
@angular-devkit/build-optimizer    0.1000.2
@angular-devkit/build-webpack      0.1000.2
@angular-devkit/core               10.0.2
@angular-devkit/schematics         10.0.2
@angular/cli                       10.0.2
@angular/pwa                       0.1000.2
@ngtools/webpack                   10.0.2
@schematics/angular                10.0.2
@schematics/update                 0.1000.2
ng-packagr                         10.0.1
rxjs                               6.5.5
typescript                         3.9.6
webpack                            4.43.0

Issue Analytics

  • State:open
  • Created 3 years ago
  • Reactions:3
  • Comments:15 (13 by maintainers)

github_iconTop GitHub Comments

1reaction
JoostKcommented, Aug 14, 2020

@diminutivesloop Yes, I indeed meant compilerOptions.paths (notice the plural s but I guess that was a typo). An entry for the primary entry-point should be sufficient to avoid the particular issue as reported here, but maybe thereā€™s something else acting up. I canā€™t think of anything from the the top of my head, though, so Iā€™m afraid I canā€™t give you any pointers at the moment. If you are able to share a reproduction then I can look into it.

1reaction
JoostKcommented, Aug 5, 2020

Letā€™s keep it open as this is a legitimate case that others might run into as well.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Angular 9 - NGCC fails with an unhandled exception
This error may be because two or more entry-points overlap and ngcc has been asked to process some files more than once. You...
Read more >
error: failed to initialize angular compilation - ngcc failed.
We are using a monorepo setup with 1 application and two libraries. One library gets published and one is private. In short: ......
Read more >
Creating libraries
This page provides a conceptual overview of how to create and publish new libraries to extend Angular functionality. If you find that you...
Read more >
Understanding Angular Ivy Library Compilation | lacolaco/tech
The biggest issue with ngcc was the execution cost of the compilation on the application side. If ngcc was fast enough, we could...
Read more >
ng-packagr | Yarn - Package Manager
ng-packagr. Compile and package Angular libraries in Angular Package Format (APF). npm License CircleCI. GitHub stars npmĀ ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found