javascript - Varför fungerar inte dynamisk importering av dayjs i typescript?

Jag arbetar på en webbsida i en .NET-app och försöker skicka datum- och tidsinställningar från systemet till webbsidan med hjälp av CefSharp-inställningar och konfiguration.

AcceptLanguageList = CultureInfo.CurrentUICulture.Name

I min TypeScript-kod vill jag använda dayjs och importera dynamiskt 'dayjs/locale/${language}' där language kommer från AcceptLanguageList ovan.

import React, { useState } from 'react';
import dayjs, { Dayjs } from 'dayjs';
import localeData from 'dayjs/plugin/localeData';

dayjs.extend(localeData);
var lang = navigator.languages != null ? navigator.languages[0] : navigator.language;
lang = lang.toLowerCase();
import(`dayjs/locale/${lang}`).then(
        () => {
            dayjs.locale(lang);
            setAdapterLocale(lang);
        });

Grejen är att när jag kör den här koden i webbläsaren och försöker importera 'dayjs/locale/fr-ca', till exempel, fungerar det bra, men när 'fr-ca' kommer från CefSharp, då misslyckas importen med

Okänt (i löftet) TypeError: Kunde inte lösa modulespecifieraren 'dayjs/locale/fr-ca'

All hjälp uppskattas mycket.

Svar #1

Om du vill använda en dynamisk sökväg för den dynamiska importen måste du först lista alla möjliga sökvägar som du eventuellt vill ha, annars kommer din bundlare inte att veta vilka filer som ska inkluderas.

Du kan lägga till import('dayjs/locale/fr-ca') var som helst i din kod och bundlern kommer att inkludera det när den bygger din app för webbläsaren.

Och du kommer fortfarande att få det felet om du inte har en lokal för användarens språk, så du bör hantera det fallet:

import(`dayjs/locale/${lang}`).then(
        () => {
            dayjs.locale(lang);
            setAdapterLocale(lang);
        },
        () => { // in case the import fails
            // maybe default to english
            dayjs.locale('en');
            setAdapterLocale('en');
        });

Svar #2

Jag listade ut det. Problemet var att när paketet byggdes för .net-appen skapades paketet med rollup (vilket inte är fallet när man kör i webbläsare). Rollup behöver viss speciell konfiguration för att stödja dynamisk import: https://www.npmjs.com/package/@rollup/plugin-dynamic-import-vars