Uncaught (in promise) TypeError: e is not a constructor

[smkart]

Version:

Error

Repro steps

• Create new angular-cli project with router enabled
• Build project in production mode " ng build --prod "
• Run the application and click on any router link to navigate
• see the console for the issue

Package.json

Background

• Issue exist from almost all the build I checked , from cli 1.6.3 + ( I can't check before this because it causes some other compile time error )
• Also the issue is only with production build , Development build works fine , I tired to debug both the build side by side , Below are the findings

Mention any other details that might be useful (optional)

• It all starts from router.navigate['/url' ] and goes into router.js
• NavigationStart( URL ) function in router.js passes control into core.js pre-builder there seems to the issue

Below function in zone.js is where the error thrown:

try catch which returns the error:

Hope the information helps, Please look into this issue ASAP since we need this to be sorted out very quickly

Thanks in advance

[smkart]

Hi,
Do we have any update regarding the above issue , We are facing hard time with this issue

It will be so helpful if I get any clue

Thanks

[quahkj]

I also encounter this issue with Angular CLI version 1.7.0. I remember I had a workaround by downgrading angular cli in package.json:

"devDependencies": {
"@angular/cli": "1.6.7",
...

But now seem like downgrading above also didn't work for me.

[gfaganli]

waiting for solution..
this error happens when i run with prod mode (ng build/serve --prod), ng build/serve does not generate this error

[matulkum]

+1

[pedro412]

+1

[abbatepabloo]

+1

[karan-intersoft]

Facing hard time with this issue.

Any update regarding this issue?

[DYudin]

the same problem in prod mode

[ChangAlanCL]

I'm having the same issue with CLI v6.0.7 and angular 6.0.3

[Behrad96]

same issue with Angular CLI v6.1.3

SOLVED:
It's because some dependency that not updated for angular 6 and rxjs 6. in my case after uninstall ngx-select-dropdown module my problem sloved. 😃 💪

[Leanvitale]

Try for this..

ng build --prod --optimization=false

[queejie]

Same problem. Same result when compiling with --optimization=false.

UPDATE:
I was able to get it to build and run with ng build --aot=false. I don't understand why, unfortunately.

FURTHER UPDATE:
I was able to get past the problem. I removed rxjs-compat and found that ngx-avatar ngx-select and some other things had compile errors. I removed those modules and rebuilt from scratch. Also, something was inserting an old version of @angular/forms, so I made sure that was at 6.1.3, to match all the other bits. Not sure why the @latest wasn't working with that.

[medisoft]

I was able to run it with the --aot=false parameter too.

[CamielK]

Same issue. Fixed it by setting the --aot=false flag

[alejandromangione]

Hey! I was with the problem, you can try deleting node_modules and reinstalling the dependencies.

[ghost]

+1 . Fixed with aot flag false but can't build in production mode without aot.

[Abdallah-khalil]

i can run ng build and it works just fine but with ng build --prod i got an error
main.978c59b99705f7cbd36b.js:1 Uncaught TypeError: e is not a function at main.978c59b99705f7cbd36b.js:1 at Array.reduceRight (<anonymous>) at main.978c59b99705f7cbd36b.js:1 at new e (main.978c59b99705f7cbd36b.js:1) at main.978c59b99705f7cbd36b.js:1 at Ir (main.978c59b99705f7cbd36b.js:1) at main.978c59b99705f7cbd36b.js:1 at new t (main.978c59b99705f7cbd36b.js:1) at Object.na [as createNgModuleRef] (main.978c59b99705f7cbd36b.js:1) at e.create (main.978c59b99705f7cbd36b.js:1)

any idea what is the cause of this

"@angular/cli": "^6.1.5",
"@angular/core": "^6.1.7",

node version v8.11.4
npm 6.4.1

[pbachman]

i had the same issue with the dependencies
"@angular/core": "6.0.3",
"@angular/cli": "^6.1.5"

works fine with
"@angular/core": "6.0.3",
"@angular/cli": "^6.0.8"

[Arnie38]

These kinds of errors had plagued us for awhile. Yes you can turn off prod/aot compiles and you won't see the issue but then you won't have a minified/uglified/treeshaken optimized bits :)

The most sane fix for us is to simply export * from any components that are causing the "ctor is not a constructor" (or similar) errors.
We haven't had the time to explore deeply but exporting your specific types (for .ts access) although should work doesn't seem to when you run bits that have been aot/prod compiled.

So from your index.ts or however you do it you should say....
"export * from ./mycomponents/mycomponent"
...not... "export {MyComponent} from ./mycomponents/mycomponentfile"
This works everytime for us.
Hopefully that is enough to go on.

[smkart]

@Abdallah-khalil
Error is only in production build, I found below command is useful to debug the production code

ng build --prod --sourcemaps --build-optimizer=false

Please try and see if you can get to the library which is causing the error (helps to narrow down the issue)

Thanks,
Mani

[Abdallah-khalil]

Thanks @Mani2693 ,
actually i did so and found that @ngrx/state was causing error for me
and when i changed extractLicenses: false in angular.json file it fixed this error for me though the bundled file is bigger with about 1MB with that option but so far it's much better than before

[bgBond]

I have the same problem after upgrading to angular 7-

"dependencies": {
"@angular/animations": "^7.1.3",
"@angular/cdk": "^7.1.1",
"@angular/common": "^7.1.3",
"@angular/compiler": "^7.1.3",
"@angular/core": "^7.1.3",
"@angular/flex-layout": "^7.0.0-beta.21",
"@angular/forms": "^7.1.3",
"@angular/http": "^7.1.3",
"@angular/material": "^7.1.1",
"@angular/material-moment-adapter": "^7.1.1",
"@angular/platform-browser": "^7.1.3",
"@angular/platform-browser-dynamic": "^7.1.3",
"@angular/router": "^7.1.3",
"@auth0/angular-jwt": "^2.1.0",
"@netbasal/ngx-content-loader": "^2.0.0",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"core-js": "^2.5.7",
"moment": "^2.23.0",
"ngx-moment": "^3.2.0",
"ngx-quill": "^4.4.2",
"quill": "^1.3.6",
"rxjs": "^6.3.3",
"stickybits": "^3.5.7",
"what-input": "^5.1.0",
"zone.js": "^0.8.26"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.6.5",
"@angular/cli": "~7.1.3",
"@angular/compiler-cli": "^7.1.3",
"@angular/language-service": "^7.1.3",
"@types/jasmine": "^2.8.7",
"@types/jasminewd2": "~2.0.2",
"@types/node": "^6.0.111",
"codelyzer": "^4.5.0",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "^2.0.2",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^1.4.3",
"karma-jasmine": "^1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"modularscale-sass": "^3.0.8",
"protractor": "~5.1.2",
"sass-loader": "^6.0.7",
"ts-node": "~4.1.0",
"tslint": "~5.9.1",
"typescript": "~3.1.6"
}

Anybody can assist?

[mgechev]

It looks like not all reported errors here are the same. @Mani2693 would share minimum demo where we can reproduce the issue?

[smkart]

@mgechev Thanks for your response , I am sorry I couldn't reproduce the issue in fiddler to share , Also for me I fixed the issue with "ng build --prod --sourcemaps --build-optimizer=false" which helps to narrow down to the library causing issue ( This library is our own created using ng-packagr )
Now I am able to fix it by changing the library building format, Everything works fine for me
But I wonder if we can have better way to report the error instead of something unknown to anyone , Which helps others to fix the error

Thanks again

Regard,
Mani
Applied Materials

[mgechev]

@Mani2693 thanks for sharing your findings! Maybe you can work with @dherges on fixing the issue.

[gigallo]

Hi

I have the same problem with Angular7 and prod mode. If i don't compile with optimizations the error changes in "ctor is not a constructor". Any help?

[xyrus02]

Same here: --aot=false works but it is rather nasty to do. We are not sure since what change on our side the error occurs but if we find something, I will comment back here.

[krojew]

I'm experiencing the exact same issue - some components cannot be created because of "is not a constructor" error in prod mode with 7.2. This should be reopened.

[petrifront]

I'm experiencing the exact same issue - some components cannot be created because of "is not a constructor" error in prod mode with 7.3. This should be reopened.

[svesax]

Same problem "o is not a constructor" when build without --aot=false --build-optimizer=false
Any news ?
Thanks!

[bgBond]

Just to update that after deleting the node modules directory and running npm install, it worked!

[svesax]

Resolved by update Angular CLI
https://stackoverflow.com/questions/43931986/how-to-upgrade-angular-cli-to-the-latest-version

[kathygit]

I am still seeing this issue. This issue should be reopened.
@angular/cli "version": "6.2.9"
When build:prod, I need "optimization=false", which results in a oversized main.xxx.ts.
This issue is NOT resolved. I wonder why we closed it?

[mgechev]

Looks like this is related to the bundle optimizer. @filipesilva any thoughts?

[filipesilva]

I think it would be better to close to issue and open a new one with a reproduction so that we could investigate.

The original issue was for Angular CLI 1.7.3, and I feel pretty confident the reproduction doesn't apply because otherwise all apps that use the router would be broken. We do test the router in many places so I don't think that holds true.

There have been other reports of the same error message across versions, but the same error message doesn't mean it's the same issue. Different problems might show the same error message. There are also reports of updating, reinstalling nodes modules, or using different flag combinations removing the error

So I think it's very hard to say anything definitive about this issue with so many different and conflicting reports and no reproduction. It is better to make a new issue with actionable information than to continue here.

[kathygit]

The common theme is we can't run with the artifacts from build:production.
All the fixes mentioned here and there didn't solve the issue.
It is still an issue, even if you can't recreate it.

[filipesilva]

@kathygit we'd really like to fix the problem you're seeing but we can't do it without some sort of reproduction. We talk a little in https://github.com/angular/angular-cli/blob/master/CONTRIBUTING.md#-submitting-an-issue about why it's important to have a reproduction.

Can you spare some time to open a new issue with a reproduction so we can dig in and fix the problem?

[krojew]

@filipesilva I've created a similar bug with some more info: #13540 Mybe this can help.

[filipesilva]

@krojew reading through that issue it sounds like it was some sort of problem with angular-resize-event, and that it was subsequently fixed in that library?

I agree it would be nice if there was a build error for it instead of breaking at runtime, but that's not always possible. Sometimes code isn't statically analysable for errors. If I had to bet it was something that broke when using minification, which is part of prod builds.

[krojew]

@filipesilva yes - it was a AOT incompatibility which was fixed. But that gives you a repeatable case to see what's actually going on and if it's possible to catch it at compile time.

[BBlackwo]

I had a similar issue with an NPM module I was consuming. The NPM module code was like this:

// my-service.js
export default class MyService {} // <-- default export

// index.js
import MyService from './my-service'
export { MyService };

The fix was to export the class instead of exporting default:

// my-service.js
export class MyService {} // <-- exporting the class

// index.js
import { MyService } from './myService'; // <-- destructured import
export { MyService };

[pconas-yschmidt]

I can support BBlackwo, in my case I had implemented a CustomUrlSerializer like so:

export default class CustomUrlSerializer implements UrlSerializer { ... }

Removing the default Keyword fixed the issue:

export class CustomUrlSerializer implements UrlSerializer { ... }

[Guilhermesfl]

Guys, if any of you still have this problem, I recommend checking your npm packages. In my case, I had a npm warn of a missing dependency and when I fixed this warn my problem was solved.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}