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: doesn't process library prefixed exports properly

See original GitHub issue

🐞 bug report

Affected Package

The issue is caused by package @angular/compiler-cli, package where ngcc belongs.

Is this a regression?

No, this is the first time we’re trying to upgrade from Angular 8 to 9.

Description

We have 30+ Angular Libraries released with Angular v8 right now. Upgrading the websites from v8 to v9, ngcc throws exceptions from the compiled files of our libraries (__ivy_ngcc__/fesm2015/app.js). The exceptions are related to Injectables consumed from our /common library.

The issue is that we export our Services with the company prefix, and ngcc is not compiling the libraries properly missing such prefix and not finding the Service. I will go deep in the exception to illustrate the problem.

🔥 Exception or Error

ERROR in ./node_modules/@company/services/__ivy_ngcc__/fesm2015/app.js 7920:148-166
"export 'HttpService' (imported as 'ɵngcc1') was not found in '@company/common'

ERROR in ./node_modules/@company/forms/__ivy_ngcc__/fesm2015/app.js 11190:272-294
"export 'PhoneNumberPipe' (imported as 'ɵngcc3') was not found in '@company/common'

Where node_modules/@company/services/__ivy_ngcc__/fesm2015/app.js has:

import * as ɵngcc0 from '@angular/core';
import * as ɵngcc1 from '@myndmanagement/common';

(function () { ɵngcc0.ɵsetClassMetadata(ChargeCodeService, [{
        type: Injectable
    }], function () { return [{ type: ɵngcc1.HttpService }]; }, null); })();

but ɵngcc1.HttpService does not exists, it should be PrefixHttpService.

Looking at node_modules/@company/services/fesm2015/app.js it seems ok:

import { PrefixHttpService } from '@company/common';
...
ChargeCodeService.decorators = [
    { type: Injectable }
];
/** @nocollapse */
ChargeCodeService.ctorParameters = () => [
    { type: MyndHttpService }
];
...
export { ChargeCodeService as PrefixChargeCodeService };

Then Ivy’s compiler is removing the Prefix for some reason 😦 the library’s index.d.ts correctly maps them as:

export {
  CommandsService as PrefixCommandsService,
  ...,
  HttpService as PrefixHttpService,
  ...,
} from './services/index';

🔬 Minimal Reproduction

I will provide enough details to show the problem, as a reproduction is complicated right now. I can mount a reproduction the next weekend if it’s required.

🌍 Your Environment

Angular Version:


Angular CLI: 9.1.12
Node: 10.18.0
OS: linux x64

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

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.901.12
@angular-devkit/build-angular     0.901.12
@angular-devkit/build-optimizer   0.901.12
@angular-devkit/build-webpack     0.901.12
@angular-devkit/core              9.1.12
@angular-devkit/schematics        9.1.12
@angular/cdk                      9.2.4
@angular/flex-layout              9.0.0-beta.31
@angular/pwa                      0.901.12
@ngtools/webpack                  9.1.12
@schematics/angular               9.1.12
@schematics/update                0.901.12
rxjs                              6.5.5
typescript                        3.8.3
webpack                           4.42.0

Anything else relevant?

@gkalpak I’ve seen some PRs from you fixing re-exports, and this topic seems related to your work. Could you give us a hand here please? thanks in advance!!

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:1
  • Comments:7 (4 by maintainers)

github_iconTop GitHub Comments

3reactions
petebacondarwincommented, Sep 1, 2020

@gkalpak your failing test was almost perfect. There was just a minor typo in the export aliases:

class Foo {}
export Foo as Bar;

should be

class Foo {}
export {Foo as Bar};

Now (for me) it is failing (as expected) with

Expected 'shared-lib/index' to be 'shared-lib'.

and

Expected 'Foo' to be 'Qux'.

(although I think we actually mean Baz not Qux)

1reaction
gkalpakcommented, Sep 1, 2020

🙇 Thank you so much, @petebacondarwin ❤️ ❤️ ❤️ This has cost me several hours of head-scratching before I decide to move to something else and come back to it later.

Good timing too - I was planning to get back to it today or tomorrow.

Read more comments on GitHub >

github_iconTop Results From Across the Web

can't find compiler ngcc module after upgrading Angular and ...
In your package.json file, change the @angular/cli version in devDependencies to: "@angular/cli": "7.1.0".
Read more >
Creating libraries - Angular
Avoid using a name that is prefixed with ng - , such as ng-library . The ng- prefix is a reserved keyword used...
Read more >
Getting Started with Monorepo with Nx Nrwl - Rupesh Tiwari
I want to create logger angular library under lib/branding folder with karma testing framework. This is my dry run result. Logger project is ......
Read more >
We really love Angular...10x as much this time
The ngcc and postinstall is still a good idea to keep and will explain that more in a moment. If you're used to...
Read more >
@angular/compiler | Yarn - Package Manager
b68994d20a, fix, correctly report error when collecting dependencies of UMD module (#44245). 6f5c0c1515, fix, ensure that ngcc does not write a lock-file ...
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