[Solved]-Error in rendering a React highcharts x-range chart-Highcharts

Seeing same error but (using Typescript) for my fix i needed to pass in Highcharts to the xrange like so:

import Highcharts from 'highcharts';
import HighchartsReact from 'highcharts-react-official';
import xrange from 'highcharts/modules/xrange';
xrange(Highcharts);

and then the markup:

<HighchartsReact
  highcharts={Highcharts}
  options={options}
  {...this.props}
/>