Vue 减少 fusioncharts 和 apexcharts 的包大小

Question

我尝试通过更改 vue-apexcharts 和 vue-fusioncharts 的导入来减小我的 vue 包大小。

这是 apexcharts 的导入：

import VueApexCharts from 'vue-apexcharts';

components: {
        apexchart: VueApexCharts,
    },

但是我只用了两种图表。

对于融合图：

import VueFusionCharts from 'vue-fusioncharts';
import FusionCharts from 'fusioncharts';
import Widgets from 'fusioncharts/fusioncharts.widgets';
import FusionTheme from 'fusioncharts/themes/fusioncharts.theme.fusion';

Widgets(FusionCharts);
FusionTheme(FusionCharts);
Vue.use(VueFusionCharts, FusionCharts);

我只将它用于一个图表“hbullet”，它会导入所有库。

fusioncharts apexcharts

Vue 版本 2.6.12

有谁知道如何只导入我想使用的图表而不是所有库。

谢谢。

Answer 1

您可以使用 FusionCharts 的模块化导入，下面是一个片段

import VueFusionCharts from 'vue-fusioncharts';
import FusionCharts from 'fusioncharts/core';
import hbullet from 'fusioncharts/viz/hbullet';

// register VueFusionCharts component
Vue.use(VueFusionCharts, FusionCharts, hbullet);

请注意，这不适用于 IE 等旧版浏览器

Vue 减少 fusioncharts 和 apexcharts 的包大小

Vue reducing bundle size of fusioncharts and apexcharts

javascript

vue.js

fusioncharts

apexcharts