How do I dynamically import locales?

[SleeplessOne1917]

See this issue for context.

I set up the formatter like so:

import setDefaultOptions from "date-fns/setDefaultOptions";
import { I18NextService } from "../../services";

export default async function () {
  let lang = I18NextService.i18n.language;
  if (lang === "en") {
    lang = "en-US";
  }

  const locale = (
    await import(
      /* webpackExclude: /\.js\.flow$/ */
      `date-fns/locale/${lang}`
    )
  ).default;
  setDefaultOptions({
    locale,
  });
}

You can see the error in the attached PR, and I can provide more information if needed.

[joaopedrodcf]

On v2 it works like this for me:

import { setDefaultOptions } from 'date-fns';
...

export const loadDateFnsLocale = async (locale: Locale) => {
    return await import(
        `date-fns/locale/${localeToDateFnsLocale[locale]}/index.js`
    );
};

export const useDateFnsLocale = () => {
   const {data} = loadDateFnsLocale('en-US'); // Example

    if (data) {
        setDefaultOptions({ locale: data.default });
    }

   ...
};

So basically seems you missed the index.js on your import