How to use flatpickr rangePlugin in Angular/TypeScript

Question

I want to use flatpickr with rangePlugin in my Angular project, but I cannot instantiate the rangePlugin after importing the plugin in TypeScript.

TypeScript error: Only a void function can be called with the 'new' keyword.ts(2350)

The way I import the plugin is:

import rangePlugin from 'flatpickr/dist/plugins/rangePlugin';
import flatpickr from 'flatpickr';

I try to use the plugin this way:

const range = new rangePlugin({ input: '#datepicker2' }));

which produces the error mentioned above.

How can I import the rangePlugin correctly?

Answer 1

// First do the imports
import flatpickr from 'flatpickr';
import rangePlugin from 'flatpickr/dist/plugins/rangePlugin';

// Then you can use the flatpickr anyway you want inside ngOnInit, as plain javascript
ngOnInit(): void {
    flatpickr("#enterYourIdHere", {
        plugins: [
            rangePlugin({
                //Enter your options here
            })
        ]
    });
}