找不到模块：错误：角度更新到 13 后，未从包中导出包路径 ./locales

Question

TypeScript 2.4 添加了对动态 import() 表达式的支持，这允许我们按需异步加载和执行 ECMAScript 模块。

尝试动态导入本地化但面临导出问题

Module not found: Error: Package path ./locales is not exported from package ....\node_modules\@angular\common (see exports field in .....\node_modules\@angular\common\package.json)

我有下面的代码

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

非常不确定如何导出它，它在 Angular 12 上运行良好。

Answer 1

我遇到了同样的问题，通过修改导入路径添加“node_modules/...”
原始代码来修复：

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

固定代码

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

Answer 2

添加系统失败

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);

参考 - https://github.com/angular/angular/issues/20487

更新

现在我们不需要使用 System.import...我认为动态 ES 导入表达式可能就足够了...

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

使用上面的代码，我仍然面临异常。在这种情况下，我遇到了 angular/angular-cli#22154 - 这是一个 webpack 错误。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`)