如何使用延迟加载模块的命名空间

Question

我有一个使用 AmCharts 库的 Angular 应用程序。为了使用图表，我想延迟加载 AmCharts，他们建议用 promises 来做。我遇到的问题是类型推断似乎不起作用，我想指定我正在创建的常量的类型。

Promise.all([
        import("@amcharts/amcharts4/core"),
        import("@amcharts/amcharts4/charts"),
        import("@amcharts/amcharts4/themes/animated"),
      ]).then((modules) => {
        const am4core = modules[0];
        const am4charts = modules[1];
        const am4themes_animated = modules[2].default;

        ...

        const valueAxis: am4charts.ValueAxis = chart.yAxes.push(
          new am4charts.ValueAxis()
        );

如果我在顶部导入模块，valueAxis 声明将起作用，但现在我在 am4charts.ValueAxis 的 am4charts 上收到错误，该名称空间不存在。有什么方法可以让它工作吗？

Answer 1

在打字稿中你可以import only the types而且它似乎在做这个把戏

所以在我的代码中我现在有：

import type * as am4chartsTypes from "@amcharts/amcharts4/charts";
import type * as am4coreTypes from "@amcharts/amcharts4/core";
...


export class Chart {
  private chart?: am4chartsTypes.XYChart;

  ngAfterViewInit() {
    ... 
    
    this.chart = am4core.create(
        this.chartWrapper.id,
        am4charts.XYChart
    );
    ...
  }

}

如何使用延迟加载模块的命名空间

How to use namespace of lazy loaded modules

amcharts

typescript-typings

angular