angle2-highchartsとAOTコンパイラを使用してexporting.jsとexport-data.jsをインポートするにはどうすればよいですか？

Question

私はangular2-highchartsを使用しています。私のグラフはうまくいきますが、グラフをXLSにエクスポートする必要があります。

私はこれを達成するために必要なすべての

は、コードのどこかで

HighchartsExporting(Highcharts); 
HighchartsExportData(Highcharts); 

をやっている、とエクスポートオプションは、チャートで表示されます。

standard solution

@NgModule({ 
    imports: [ 
     BrowserModule, 
     ChartModule.forRoot(
     require('highcharts'), 
     require('highcharts/modules/exporting') 
     ], 

がいくつかコンパイル時にを「エラーが静的に解決シンボル値に遭遇した」私を与えて、AOTでは動作しませんので。問題は、適切HighchartsExportingとHighchartsExportDataをインポートする方法です

私はそれがhere提案されているよう

import * as HichartsExporting from 'highcharts/modules/exporting'; 
import * as HighchartsExportData from 'highcharts/modules/export-data'; 

を行うことによって仕事を得ることができますが、それは私に2つのエラー与える：エクスポート/モジュール「"XXXX/highcharts /モジュール：

• エラーTS2497を"'は を非モジュールエンティティに解決し、この構造を使用してインポートすることはできません。 - JITコンパイル
• 'highcharts/modules/export-data'モジュールが見つかりません。からhere提案として

  import HichartsExporting = require('highcharts/modules/exporting'); 
  import HighchartsExportData = require('highcharts/modules/export-data'); 
  

  を実行して、AOTコンパイル

私はこの問題を回避することができますが、AOTコンパイルした後、私が手を：実行時に "キャッチされないにReferenceErrorがに定義されていない必要"。

実際にはすべてのソリューションが正常に動作しているようですが、コンパイルできません。どんな提案も大歓迎です。

Answer 1

念のために、これは私が輸入を使用してそれを行うことができなかった人に、役立ちます。代わりに、自分のHTMLに<script src="~/node_modules/highcharts/modules/exporting.js">タグを含める必要がありました。このJSは自己呼び出し関数なので、それを動作させるために必要なことはすべてです。

Answer 2

あなたはHighchartsModule(Highcharts)のようにロードされたすべてのモジュールでHighchartsのインスタンスを作成し、angular2-highcharts docsで説明したようにforRoot機能にインスタンスを渡すことができます。

requireまたはimportを使用してモジュールを読み込むことができるはずです。

import * as Highcharts from 'highcharts'; 
require('highcharts/modules/exporting')(Highcharts); 

または

import * as Highcharts from 'highcharts'; 
import * as HC_exporting from 'highcharts/modules/exporting'; 
HC_exporting(Highcharts); 

と述べたドキュメントのように、次の同じ：

@NgModule({ 
    ... 
    imports: [ 
     BrowserModule, 
     ChartModule.forRoot(
-  require('highcharts'), 
+  Highcharts 
    ) 
    ], 
})