Module not found: Error: Can't resolve './locale'

[olivermuc]

I'm trying to use this with Chart.js in my Stencil web component project, which also uses date-fns (not moment.js).

Per the instructions, here is what I added to the particular component.tsx file:

import Chart from 'chart.js';
import 'chartjs-adapter-date-fns';

Still, NG throws this warning: Module not found: Error: Can't resolve './locale' in '/Users/..../stencil/oia-collection/dist/esm/es5/build'

Anything I missed?

Btw I'm using date-fns v2 - not sure if that makes a difference as it indeed is different to date-fns in some areas, such as a new formats API (Unicode Technical Standard #35).

Re. date-fns v2 support, I will open a new issue, perhaps I can contribute a PR - shouldn't be a big change.

EDIT: The error is thrown on the Ionic project level, not during the Stencil build process.

[kurkle]

Most likely issue with date-fns v2. As its still alpha, I didn't poke around it yet. Might be that you just have to import a locale for it (somewhat similar issue)

You are welcome to create a PR for supporting it 👍

[olivermuc]

I will experiment with adding a locale specifically to the component's code, although I am already adding/initialising a date-fns locale elsewhere.

Thanks for the pointer! I will report back.

[olivermuc]

While I am looking at the code here I saw that your format() call does not take locale information into consideration - unless I am missing something: https://github.com/chartjs/chartjs-adapter-date-fns/blob/5e5d2c3fba3e757f52976416d65e0ae4529fb5b3/src/index.js#L44

Even date-fns v1 requires an extra options parameter to transport locale info, unlike moment.js which allows to set current locale 'globally' for any subsequent moment() calls.

date-fns format(): format(date, formatStr, { locale: locale})

Happy to take some of the back & forth offline to avoid overly spamming :) - but equally happy to continue here as well.

[kurkle]

Initially there was no way of providing options to adapter, hence no locale support. But that has changed since and implemented in luxon adapter.

The change is probably as simple as return format(time, fmt, this->options); for format. For parse, I think there needs to be some checks if we are using v1 or v2.

We can continue in Chart.js Slack

[kurkle]

@olivermuc, how was this specific error resolved, was it a bundling issue with ionic and / or stencil?

[olivermuc]

Tbh, I don't recall what the original issues were exactly related to, but believe that initially it had to do with the fact that I was not loading moment.js and wanted to fully suppress loading it. Hence I added custom bundling setups to both Stencil and to exclude moment.js.

Also, date-fns v2 as noted above comes with other functions (also renamed ones!) that may have thrown the reported error simply due to the way used in the adapter for date-fns v1.

With the v2 adapter + adjusted bundling configs it's all good. Zero moment.js and a locale supporting date-fns v2 adapter.