Not working in Angular 19

[jatingarala]

I face following error when updater angular 18 to angular 19

[ERROR] TS1203: Export assignment cannot be used when targeting ECMAScript modules. Consider using 'export default' or another module format instead. [plugin angular-compiler]

node_modules/echarts/index.d.ts:23:0:
  23 │ export = echarts;
     ╵ ~~~~~~~~~~~~~~~~~

[kalgon]

I had the same problem and had to downgrade echarts to ~5.4.3 (until the problem is fixed)

[filippobrigati]

I have installed the latest ngx-echarts (v19) but the problem persist...I'm using echarts 5.5.1

I have to do something else?

[xieziyu]

@filippobrigati
Please check if your file contains code that directly imports from the echarts package. If it does, please change it to import from echarts/core or other entry points.

[simon04]

Alternatively, applying the following patch using yarn patch echarts did the trick for me.

diff --git a/index.d.ts b/index.d.ts
index 811908a8734db3b4fb270e95ef47cc39eb6bc05c..d8fe2dafc7d40da96c9c7da3fd447d7107de0439 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -20,4 +20,4 @@
 import * as echarts from './types/dist/echarts';
 // Export for UMD module.
 export as namespace echarts;
-export = echarts;
\ No newline at end of file
+export * from './types/dist/echarts';
\ No newline at end of file

[filippobrigati]

@filippobrigati Please check if your file contains code that directly imports from the echarts package. If it does, please change it to import from echarts/core or other entry points.

thanks, it worked

[Chewieez]

Where can we import things like SeriesOption, LineSeriesOption, GridComponentOption, YAXisComponentOption, etc?

They are not available on /core or /charts or /components

also, previously I had code like this:
if (this.chartOption?.series as SeriesOption[])?.length)

and now after I removed use of the type SeriesOption, I need to refactor it to be like this:
if (this.chartOption['series'] as [])?.length)

due to Typescript error saying ":Property 'series' comes from an index signature, so it must be accessed with ['series']."

[xieziyu]

@Chewieez

According to the package.json provided in echarts, I think you can try this

import type { SeriesOption } from 'echarts/types/dist/shared';

[daanditp]

I've got the same problem after upgrading Angular from version 18 to 19..

-I tried adjusting the configuration of tsconfig.json, but that didn't solve it;
-The yarn patch did not work for me, as the patch command was not recognized and also my app uses npm;
-Didn't try downgrading ECharts to an older version, because earlier versions will have have the CommonJs based export in index.d.ts;

Could the problem for Angular 19 (temporarily) be solved by Echarts devs by patching the index.d.ts code from

import * as echarts from './types/dist/echarts';
// Export for UMD module.
export as namespace echarts;
export = echarts;

to

export * from './types/dist/echarts';

?

[Chewieez]

@Chewieez

According to the package.json provided in echarts, I think you can try this

import type { SeriesOption } from 'echarts/types/dist/shared';

I tried changing all my imports to that path for SeriesOption and still could not get the app to compile. I just keep getting that same error about node_modules/echarts/index.d.ts:23:0: export = echarts;.

Also XAXisComponentOption and YAXisComponentOption are not in '/shared'. They appear to exist in 'echarts/types/dist/echarts'. And everything seems to exist there, so maybe that's a better path.

BUT none of this changing import paths feels like the correct long term solution here. I can change them in my app, but the auto complete in VS Code will most likely still suggest just using '/echarts' and other devs on the team won't know to dig further into the package for the correct import path.

Late EDIT:
I have been successful in compiling my app now after changing all echart import paths to use 'echarts/types/dist/echarts', and also changing the import logic in app.module.ts to use the tree-shaking custom build instructions.

// echarts imports
import { NgxEchartsModule, provideEchartsCore } from 'ngx-echarts';
// import echarts core
import * as echarts from 'echarts/core';
// import necessary echarts components
import { BarChart, GaugeChart, LineChart } from 'echarts/charts';
import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components';
import { CanvasRenderer } from 'echarts/renderers';
echarts.use([
  BarChart,
  CanvasRenderer,
  GaugeChart,
  GridComponent,
  LineChart,
  LegendComponent,
  TooltipComponent
]);

[daanditp]

Thanks! Unfortunately it's not the solution. The problem is that TypeScript is not accepting the Common.js syntax in the Node.js file index.d.ts in a EMS based app. I am able to silence the error by adding "skipLibCheck": true to "compilerOptions" in my tsconfig.json though. Might not be the best solution, but as long as Echarts has no fix for it, it works to prevent my build from failing.

[surya-whitehatvirtual]

I do not have any direct imports of echarts other than NgxEchartsModule.forRoot({ echarts: () => import('echarts') }) I still have the issue with typescript versions 5.6 and above it does not cause issue with 5.5.4

I understand the core issue lies with the echarts dependency but is there a way to fix this other than with "skipLibCheck": true

[anders8]

I do not have "skipLibCheck": true, but instead, in my app.module.ts, I changed the import to this:
NgxEchartsModule.forRoot({ echarts: () => import('echarts/index.common') }),

Also working for me:
NgxEchartsModule.forRoot({ echarts: () => import('echarts/index.simple') }),

They include different amounts of stuff, so I expect this will be a fix only for some people, depending on which chart features they're using.

[adrianowy]

@Chewieez

According to the package.json provided in echarts, I think you can try this

import type { SeriesOption } from 'echarts/types/dist/shared';

thanks, it worked