Adding a system didn't work

let angularLocale = convertAbpLocaleToAngularLocale(abp.localization.currentLanguage.name);
      System.import(`@angular/common/locales/${angularLocale}.js`)
                .then(module => {
                    registerLocaleData(module.default);
                    NgxBootstrapDatePickerConfigService.registerNgxBootstrapDatePickerLocales().then(_ => {
                        resolve(true);
                        abp.ui.clearBusy();
                    });
                }, reject);

Reference - https://github.com/angular/angular/issues/20487

Update

We don't need to use System.import these days... I think that a dynamic ES import expression might be enough...

let angularLocale = convertAbpLocaleToAngularLocale(abp.localization.currentLanguage.name);
import(`@angular/common/locales/${angularLocale}.js`).then(module => registerLocaleData(module.default));

With the above code, I still face the exception. In that case, I was hitting angular/angular-cli#22154 - this is a webpack bug. https://github.com/angular/angular/issues/20487 https://github.com/angular/angular-cli/issues/22154

import(
  /* webpackExclude: /\.d\.ts$/ */
  /* webpackMode: "lazy-once" */
  /* webpackChunkName: "i18n-extra" */
  `@/../node_modules/@angular/common/locales/${angularLocale}.mjs`)

As mentioned in the https://github.com/angular/angular-cli/issues/22154 issue, you need to update the import path with /node_modules/@angular/common/locales/${locale}.mjs.

The below code works for me in my AspNetZero project after upgrading to angular version 13.

NOTE: Make sure to restart "ng serve" command after these changes for webpack to do its magic.

async function registerLocales(resolve: (value?: boolean | Promise<boolean>) => void, reject: any, spinnerService: NgxSpinnerService) {
if (shouldLoadLocale()) {
    let angularLocale = convertAbpLocaleToAngularLocale(abp.localization.currentLanguage.name);
    await import(`/node_modules/@angular/common/locales/${ angularLocale }.mjs`)
        .then(module => {
            registerLocaleData(module.default);
            NgxBootstrapDatePickerConfigService.registerNgxBootstrapDatePickerLocales().then(_ => {
                resolve(true);
                spinnerService.hide();
            });
        }, reject);
} else {
    NgxBootstrapDatePickerConfigService.registerNgxBootstrapDatePickerLocales().then(_ => {
        resolve(true);
        spinnerService.hide();
    });
}

}

I had the same problem that I fixed by modifying the import path adding 'node_modules/...'
original code:

import(`@angular/common/locales/${angularLocale}.js`)

fixed code

import(`/node_modules/@angular/common/locales/${angularLocale}.js`)