'Chart is not a constructor' when importing as ES6 module

After installing as a npm module (npm install frappe-charts), I’m unable to import a constructor.

Docs says to import like this:

import {Chart} from 'frappe-charts'

…the docs from NPM says to import like this:

import Chart from 'frappe-charts/dist/frappe-charts.min.esm'

Either way it doesn’t work for me.

const chart = new Chart(this.chartWrapper, {...})

results in *.Chart is not a constructor error.

I’m using Webpack 4 and React 16 (but React shouldn’t have anything to do with this issue).

Frappé Charts version: v1.1.0

Any suggestions? Thanks!

[andreasvirkus]

You need to import the EcmaScript module straight from the dist folder:

import { Chart } from 'frappe-charts/dist/frappe-charts.esm.js'

cc @deligent-ant @maulerjan @panjizhi

[himynameisdave]

@scmmishra in the next major version, will there just be a hybrid import which combines ESM/CommonJS (like most NPM packages)? This way users can just do:

// In ESM environments:
import { Chart } from 'frappe-charts';

// In CJS environments:
const { Chart } = require('frappe-charts');

This would be great, so that developers don’t need to worry about digging into the /dist/ folder to find the file that they need.