角度2のChartModuleでのプロダクションビルドの問題

Question

プロダクションフラグでアプリケーションをビルドしようとしましたが、このようなエラーがあります。ので、私使用している使用の

Error: Error encountered resolving symbol values statically. Reference to a local (non-exported) symbol 'require'. Consider exporting the symbol (position 38:13 in the origi 
nal .ts file), resolving symbol AppModule in C:/Users/fs/Desktop/venky/new futures/futures-services latest/src/app/app.module.ts 

このエラーは、このようなhighchartsのために必要と私は私がこの記事を踏襲していると私はすべてのエラーを取得しますが、私はなかった直接

ChartModule.forRoot(require('highcharts'),require ('../../node_modules/highcharts/highcharts-more.js')) 

ChartModuleを使用することはできないですグラフが表示されません。これを整理するために私に助けを与えなさい。

Angular 2 - AOT - Calling function 'ChartModule', function calls not supported

これは私が同じ問題の生産ビルドが正常に

import { HighchartsStatic } from 'angular2-highcharts/dist/HighchartsService'; 
import { ChartModule } from 'angular2-highcharts'; 
declare var require: any; 
export function highchartsFactory() { 
    var hc = require('highcharts'); 
    var hcm = require('highcharts/highcharts-more'); 
    hcm(hc); 
    return hc; 
} 

providers: [ 
    { 
     provide: HighchartsStatic, 
     useFactory: highchartsFactory 
    }, 
    ], 
    bootstrap: [AppComponent] 
}) 
export class AppModule 

Answer 1

私のソリューションは、次のされた取得する何をしたかである：

• あなたが必要highchartsスクリプトを含めますindex.html（あなたのsystemjs.configスクリプトの前またはAOTのbuild.jsの前）たとえば ：

<script src="../node_modules/highcharts/highcharts.js"></script> 
 
    <script src="../node_modules/highcharts/highcharts-more.js"></script> 
 
    <script src="../node_modules/highcharts/modules/solid-gauge.js"</script>

• このブラウザのwindowオブジェクト上Highchartsと呼ばれるオブジェクトを作成し、そこから、あなたの角のモジュールでそれを使用することができます。

  import { ChartModule } from "angular2-highcharts/dist/index"; 
  
  import { HighchartsStatic } from 'angular2-highcharts/dist/HighchartsService'; 
  
      export function highchartsFactory() { 
       return (<any>window).Highcharts; 
      } 
  
  @NgModule({ 
      imports: [BrowserModule, 
       HttpModule, 
       ChartModule], 
      declarations: [AppComponent], 
      providers: [ 
       { 
        provide: HighchartsStatic, 
        useFactory: highchartsFactory 
       } 
      ], 
      bootstrap: [AppComponent] 
  }) 
  export class AppModule { } 
  

ロールアップでimport 'highcharts-more.js'のような非通常のインポートを正しく処理できません。それは 'Module'からimport {module}のみを扱うことができます。