error TS2440: Import declaration conflicts with local declaration of 'Highcharts3d'

Question

I am trying to run my application in VS code and I keep getting the error:

error TS2440: Import declaration conflicts with local declaration of 'Highcharts3d'

please help to me to fix this error

    import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
    import * as Highcharts from 'highcharts';
    import * as Highcharts3d from "highcharts/highcharts-3d";
    
    declare var require: any
    
    let Highcharts3d:any = require("highcharts/highcharts-3d");
    let HighchartsExporting = require("highcharts/modules/exporting"); 

    Highcharts3d(Highcharts);

Answer 1

Problem: You have a duplicate variable declaration:

• import * as Highcharts3d from "highcharts/highcharts-3d";
• let Highcharts3d: any = require("highcharts/highcharts-3d");

rename the variable declaration - rename let Highcharts3d to something different.

Solution: Rename either

• import * as different_name from "highcharts/highcharts-3d";
• OR
• let different_name: any = require("highcharts/highcharts-3d");