加载实体仪表模块时出现 Highcharts 错误

Question

我有与 highcharts-vue 一起使用的 highcharts。

我加载了几个插件并按预期工作：

import Vue from 'vue';
import Highcharts from 'highcharts';
import HighchartsVue from 'highcharts-vue';
import stockInit from 'highcharts/modules/stock';
import noDataToDisplay from 'highcharts/modules/no-data-to-display';
import solidGauge from 'highcharts/modules/solid-gauge';

if (typeof Highcharts === 'object' && typeof window !== 'undefined') {
  stockInit(Highcharts);
  solidGauge(Highcharts);
  noDataToDisplay(Highcharts);
}

Vue.use(HighchartsVue, {tagName: 'charts'});

但是我刚刚添加的 solid-gauge 模块产生了一个错误：

Uncaught TypeError: Object prototype may only be an Object or null: undefined
    at setPrototypeOf (<anonymous>)
    at a (solid-gauge.js:15:327)
    at eval (solid-gauge.js:15:388)
    at eval (solid-gauge.js:16:308)
    at eval (solid-gauge.js:19:291)
    at f (solid-gauge.js:11:175)
    at eval (solid-gauge.js:14:442)
    at eval (highcharts.js:34:72)
    at Module../plugins/highcharts.js (app.js:5244:1)
    at __webpack_require__ (runtime.js:854:30)

我几乎看不出如何从这一步进一步调查。

我确实将我的 highcharts npm 依赖更新到 10.0.1，但错误仍然存在。

不胜感激！

干杯

Answer 1

您需要在solid-gauge之前导入并初始化highcharts-more模块。

import Vue from 'vue';
import Highcharts from 'highcharts';
import HighchartsVue from 'highcharts-vue';
import hcMore from 'highcharts/highcharts-more';
import stockInit from 'highcharts/modules/stock';
import noDataToDisplay from 'highcharts/modules/no-data-to-display';
import solidGauge from 'highcharts/modules/solid-gauge';

if (typeof Highcharts === 'object' && typeof window !== 'undefined') {
  hcMore(Highcharts);
  stockInit(Highcharts);
  solidGauge(Highcharts);
  noDataToDisplay(Highcharts);
}

现场演示： https://jsfiddle.net/BlackLabel/2dqL70hy/

加载实体仪表模块时出现 Highcharts 错误

Highcharts Error while loading solid gauge module

highcharts