fusioncharts / angular-fusioncharts

Angular Component for FusionCharts JavaScript Charting Library
https://fusioncharts.github.io/angular-fusioncharts/#/ex1
Other
55 stars 37 forks source link

Problem in Build Angular 5.0.0 #34

Open leonetosoft opened 5 years ago

leonetosoft commented 5 years ago

I tried upgrading the fusioncharts to version 3.13.2 along with the version of angular-fusioncharts 2.0.2.

I made the changes in app.modules:

import {FusionChartsModule} from 'angular-fusioncharts';
import * as FusionCharts from 'fusioncharts';
import * as Charts from 'fusioncharts / fusioncharts.charts';
import Fint from 'fusioncharts / themes / en / fusioncharts.theme.fint';

FusionChartsModule.fcRoot (FusionCharts, Charts, Fint);

then I imported FusionChartsModule.

Everything works fine with "ng serve", but when I use "ng build --prod" I get this error in console chrome: image

On the chart I got the message that I did not import correctly: "Chart type not suported"

Why is not it working in production?

Angular Version: 5.0.0 Browser: Google Chrome Version 69.0.3497.100 (Official) 64-bit Fusioncharts library: 3.13.2 angular-fusioncharts: 2.0.2

ashok1994 commented 5 years ago

@leonetosoft Sorry for the inconvinience, For production , webpack is not bundling other dependencies, seems like a bundler issue .We are still looking into the problem, though there is another way of adding dependencies.

import { FusionChartsModule } from 'angular-fusioncharts';
import * as FusionCharts from 'fusioncharts';
import * as Charts from 'fusioncharts/fusioncharts.charts';
import * as Fint from 'fusioncharts/themes/fusioncharts.theme.fint';
Charts(FusionCharts);
Fint(FusionCharts);
FusionChartsModule.fcRoot(FusionCharts);
leonetosoft commented 5 years ago

@ashok1994 Got it, I saw that the way to import the library is constantly changing. At this moment I will wait for a solution.

I am currently using fusioncharts 3.13.1-sr.1, and importing as follows:

import {FusionChartsModule} from 'angular-fusioncharts';
import FusionCharts from 'fusioncharts / core';
import Column2d from 'fusioncharts / viz / column2d';
import line from 'fusioncharts / viz / line';
import pie2d from 'fusioncharts / viz / pie2d';
import pie3d from 'fusioncharts / viz / pie3d';
import mscolumn2d from 'fusioncharts / viz / mscolumn2d';
import mscolumn3d from 'fusioncharts / viz / mscolumn3d';
import msline from 'fusioncharts / viz / msline';
import Fint from 'fusioncharts / themes / en / fusioncharts.theme.fint';
FusionChartsModule.fcRoot (FusionCharts, Column2d, Fint, line, pie2d, pie3d, mscolumn2d, mscolumn3d, msline);

It's working on both dev and production ... In the new model will not it be necessary to import type by type (pie2d, pie3d, etc ...)? .. this has gotten me pretty confused. When we update our dependencies we lost a lot of time with these problems ....

Thank you very much for your response, and congratulations on the beautiful work!

ashok1994 commented 5 years ago

@leonetosoft There are few problems with that approach (importing type by type) we encountered , many libraries like React and Angular , don't compile code down to es5 which are present inside node_modules folder, So normally it is recommended to ship es5 code in the node_modules and our code currently is in es6 form. We are working a way out to ship ES5 code where you can import chart , type by type. Though , this particular syntax works currently , if you have access to your webpack, and you add a config that says "Hey, Webpack , please transpile the ES6 code in the node_modules too".

If it works for you then its great , I ll have a look , and find out what changed.

Back to this problem ,

"Chart type not supported"

, normally it works, in dev mode , but in prod mode, somehow , the code related to charts not getting bundled up. So FusionCharts has a feature where it requests resources if not available through XHR , which is again, wont be available because it looks for a particular pattern of location. Ideally speaking , if we are importing 'fusioncharts.charts.js' then it should bundle it with the other resources as it is getting used by angular-fusioncharts .

We are still working on it , to find a clear way, though the above way of injecting dependencies works.

Let me know, if i can help you with anything

priyanjitdey94 commented 4 years ago

@leonetosoft Have you checked with the latest version of fusioncharts and angular-fusioncharts? We tried to replicate the issue at our end, but failed. If you are still facing this issue, please let us know along with steps to reproduce.