ChartModule以角度2生成构建问题

时间:2017-06-09 09:25:20

标签: angular highcharts ionic2

我尝试用生产标志构建我的应用程序我有这样的错误。

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

这个错误是因为我已经使用过像这样的高级图表而且我不允许直接使用ChartModule

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

我已经关注这篇文章,我没有得到任何错误,但我的图表没有显示。帮我整理一下。

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

1 个答案:

答案 0 :(得分:1)

我对同样问题的解决方案如下:

  • 在index.html中包含所需的highcharts脚本(在systemjs.config脚本之前或在build.js之前的AOT中)。 例如:



    <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>
&#13;
&#13;
&#13;

  • 这将在浏览器的窗口对象上创建一个名为Highcharts的对象,然后您可以在Angular模块中使用它:

    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 { }
    

Rollup无法正确处理非普通导入,例如import&#39; highcharts-more.js&#39;。它只能处理来自&#39; Module&#39 ;;

的import {module}
相关问题