TypeError: (0 , tslib__WEBPACK_IMPORTED_MODULE_1__.__extends) is not a function

Question

I try to install a chart library with Angular 14. I tried ngx-charts and ngx-echarts. For both I get the following exception when I open the page which contains the chart in the browser:

Error: Uncaught (in promise): TypeError: (0 , tslib__WEBPACK_IMPORTED_MODULE_1__.extends) is not a function TypeError: (0 , tslib__WEBPACK_IMPORTED_MODULE_1.__extends) is not a function at Handler.js:32:14 at 328 (Handler.js:31:19) at webpack_require (bootstrap:19:1) at 14215 (transformPath.js:81:2) at webpack_require (bootstrap:19:1) at 64749 (Scheduler.js:557:1) at webpack_require (bootstrap:19:1) at 52437 (core.js:51:1) at webpack_require (bootstrap:19:1) at 72750 (node_modules_echarts_index_js.js:70:75) at resolvePromise (zone.js:1211:31) at zone.js:1118:17 at zone.js:1134:33 at asyncGeneratorStep (asyncToGenerator.js:6:1) at _throw (asyncToGenerator.js:29:1) at _ZoneDelegate.invoke (zone.js:372:26) at Object.onInvoke (core.mjs:26318:33) at _ZoneDelegate.invoke (zone.js:371:52) at Zone.run (zone.js:134:43) at zone.js:1275:36

My module looks like this:

@NgModule({
  declarations: [
    SiteTemplateComponent,
    DisclaimerComponent,
  ],
  imports: [
    CommonModule,
    RouterModule,
    SharedModule,
    NgxEchartsModule.forRoot({
      /**
       * This will import all modules from echarts.
       * If you only need custom modules,
       * please refer to [Custom Build] section.
       */
      echarts: () => import('echarts'), // or import('./path-to-my-custom-echarts')
    }),
  ],
  exports: [CommonModule,
    HomeRoutingModule,
    SiteTemplateComponent]
})
export class HomeModule { }

My component.html like this:

Is saw that they use Angular 14 in the github project (https://github.com/xieziyu/ngx-echarts/blob/master/package.json) as well. I'm also using the same packages in my project. Any idea why this error occurs for me?

TypeError: (0 , tslib__WEBPACK_IMPORTED_MODULE_1.extends) is not a function

0 Answers