Doug Brunner
Doug Brunner

Reputation: 99

How to fix production build with amplify-authenticator in Angular 9 project?

I've got a project using Angular 9 that has an <amplify-authenticator> element, and have imported AmplifyUIAngularModule from @aws-amplify/ui-angular in the single module in the project. It runs fine in a dev build, but when I try to do a production build, it fails:

ERROR in src/app/signin/signin.page.html:13:5 - error NG8001: 'amplify-authenticator' is not a known element:
1. If 'amplify-authenticator' is an Angular component, then verify that it is part of this module.
2. If 'amplify-authenticator' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

13     <amplify-authenticator [handleAuthStateChange]="handleAuthStateChange">
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  src/app/signin/signin.page.ts:7:18
    7     templateUrl: 'signin.page.html',
                       ~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component SigninPage.

I'm using the new Amplify UI Components for Angular, so as far as I can tell there's nothing else to import. Any ideas what could be going wrong?

Upvotes: 0

Views: 1920

Answers (3)

user3256674
user3256674

Reputation: 1

I was building my release as follows:

ionic cordova build android --prod --release

Only after removing the --prod parameter, I assume the profile, did it start working.

Upvotes: 0

Doug Brunner
Doug Brunner

Reputation: 99

Turned out that I had forgotten to put SigninPage itself into the module. Adding it to declarations fixed the problem. No idea how the app was able to run with the JIT compiler...🤷‍♂️

Upvotes: 0

Raz Ronen
Raz Ronen

Reputation: 2628

Please import AmplifyUIAngularModule in the same NgModule that SignPageComponent is declared in.

AOT (Ahead of Time) compiler resolve the NgModules in sequential order.

Upvotes: 2

Related Questions