TypeError: this.flatpickrElement.nativeElement.flatpickr is not a function in prod build

[pjl1983]

ERROR { TypeError: this.flatpickrElement.nativeElement.flatpickr is not a function at Ng2FlatpickrComponent.ngAfterViewInit (/usr/src/project/node_modules/ng2-flatpickr/bundles/~/ng2-flatpickr/src/ng2-flatpickr.component.ts:58:56) at callProviderLifecycles (/usr/src/project/node_modules/packages/core/esm5/src/view/provider.js:591:9) at callElementProvidersLifecycles (/usr/src/project/node_modules/packages/core/esm5/src/view/provider.js:558:12) at callLifecycleHooksChildrenFirst (/usr/src/project/node_modules/packages/core/esm5/src/view/provider.js:541:2) at checkAndUpdateView (/usr/src/project/node_modules/packages/core/esm5/src/view/view.js:400:5) at callViewAction (/usr/src/project/node_modules/packages/core/esm5/src/view/view.js:742:14) at execComponentViewsAction (/usr/src/project/node_modules/@angular/core/bundles/core.umd.js:14123:13) at checkAndUpdateView (/usr/src/project/node_modules/@angular/core/bundles/core.umd.js:13846:5) at callViewAction (/usr/src/project/node_modules/packages/core/esm5/src/view/view.js:742:14) at execComponentViewsAction (/usr/src/project/node_modules/@angular/core/bundles/core.umd.js:14123:13) at checkAndUpdateView (/usr/src/project/node_modules/@angular/core/bundles/core.umd.js:13846:5) at callViewAction (/usr/src/project/node_modules/packages/core/esm5/src/view/view.js:742:14) at execEmbeddedViewsAction (/usr/src/project/node_modules/@angular/core/bundles/core.umd.js:14149:17) at checkAndUpdateView (/usr/src/project/node_modules/packages/core/esm5/src/view/view.js:392:5) at callViewAction (/usr/src/project/node_modules/packages/core/esm5/src/view/view.js:742:14) at execComponentViewsAction (/usr/src/project/node_modules/@angular/core/bundles/core.umd.js:14123:13)

[mezoistvan]

Please provide a more detailed reproduction. Closing until then.

[Lonking1990]

When I'm using this while developing, everything works fine, but when i compile the application as prod mode, i get the following error:

main.js:1 ERROR TypeError: this.flatpickrElement.nativeElement.flatpickr is not a function
    at e.ngAfterViewInit (main.js:1)
    at Ea (main.js:1)
    at Pa (main.js:1)
    at Aa (main.js:1)
    at Xa (main.js:1)
    at ls (main.js:1)
    at as (main.js:1)
    at Xa (main.js:1)
    at ls (main.js:1)
    at ss (main.js:1)

As far as I can debug, i get the error is being thrown in the ngAfterViewInit:

e.prototype.ngAfterViewInit = function() {
    this.config && Object.assign(this.defaultFlatpickrOptions, this.config),
    this.flatpickr = this.flatpickrElement.nativeElement.flatpickr(this.defaultFlatpickrOptions),
    this.setDate && this.setDateFromInput(this.setDate)
}

I don't know what changes between dev and prod mode to cause this error, or even if its related to the thread, but solving it would be great

[canbax]

I got the same error. When I use "ng serve" to run my angular app, it runs fine but
When I get a production build and use "express" as a web server to run it I got error. The input field became a normal text input field

here the error message
main.0905212eca6f960e3404.js:1 ERROR TypeError: this.flatpickrElement.nativeElement.flatpickr is not a function
at e.ngAfterViewInit (main.0905212eca6f960e3404.js:1)

note: I'm using angular 7

[aamir1995]

@pjl1983 @Lonking1990 you'll need to upgrade your project to Angular 8 or you can downgrade ng2-flatpickr to 7.0.5 alternatively, to make it work.

[bvangennep]

Try adding an import 'flatpickr' to your project to solve this issue.
I suspect the flatpickr is optimized away in the production build process.