ngx-toastr giving error c.Subject is not a constructor when angular app is being served by nginx using dist

36 Views Asked by At

I have an angular app and the home page is a template from Bootstrapmade.com. The template is edited to include ngx-toastr and I show some pop-ups. If I run the same code on localhost via ng serve, it is working fine. But if I create dist using ng build --prod, then the same toastr code is giving error as

​ ERROR TypeError: c.Subject is not a constructor
    at new e (main.42af73f….js:1:1336551)
    at e.value (main.42af73f….js:1:1340579)
    at e.value (main.42af73f….js:1:1338410)
    at e.sendMail (/9.1239612….js:1:86136)
    at /9.1239612….js:1:136416
    at Xu (main.42af73f….js:1:712642)
    at r (main.42af73f….js:1:712804)
    at HTMLInputElement.<anonymous> (main.42af73f….js:1:1077547)
    at t.invokeTask (polyfills.e071be3….js:1:8982)
    at Object.onInvokeTask (main.42af73f….js:1:814856)

Code is below

if(isInvalid === true){
this.toaster.error('Please provide the correct email ids. Please separate multiple email ids with a comma (,).','Invalid Email Ids',{
          closeButton:true,        
          tapToDismiss: false,
          positionClass: 'toast-top-center'
        });
}

Below is the output of ng version

Angular CLI: 11.2.0
Node: 14.18.1
OS: win32 x64

Angular: 11.2.1  animations, cdk, common, compiler, compiler-cli, core, forms 
material, platform-browser, platform-browser-dynamic
platform-server, router, upgrade`

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1102.0
@angular-devkit/build-angular   0.1102.0
@angular-devkit/core            11.2.0
@angular-devkit/schematics      11.2.0
@angular/cli                    11.2.0
@angular/http                   7.2.0-beta.2
@schematics/angular             11.2.0
@schematics/update              0.1102.0
rxjs                            6.6.3
typescript                      4.1.5

I tried looking for solution on internet, but nothing was helpful.

import { Subject } from "rxjs"; is already added.

1

There are 1 best solutions below

3
Tal B On

It seems like Ahead of Time compilation is doing it, see if this occurs when you serve the app as production:

ng serve --prod

also, you can troubleshoot this disabling Ahead of Time compilation:

ng build --prod --aot=false