开发环境和生产环境饼图label显示不一致

[chqfly]

请确认

• [X] 我可以确认这个问题无法在 ECharts 项目本身中复现。

您是如何将 Vue-ECharts 引入项目的？

通过 ES 模块 import

版本信息

"echarts": "^5.4.1",
"vue": "^3.2.45",
"vue-echarts": "latest"

问题详情

1. 开发环境：

npm run dev

显示正常，效果如下：

2. 生产环境

npm run build
npm run preview

圆中心label显示重叠，效果如下：

问题复现

https://stackblitz.com/edit/vue-echarts-vue-3-n2cgoq?file=src%2FApp.vue,package.json

[Justineo]

可以给 series[0].label 添加 backgroundColor: '#100C2B' 来绕过，具体原因暂不清楚。

需要引入 echarts/features 中的 LabelLayout 功能，未引用的话在打包后会被 treeshake 掉。

  import { use } from 'echarts/core';
  import { CanvasRenderer } from 'echarts/renderers';
  import { PieChart } from 'echarts/charts';
  import {
    TitleComponent,
    TooltipComponent,
    LegendComponent,
  } from 'echarts/components';
+ import { LabelLayout } from 'echarts/features';

  use([
    CanvasRenderer,
    PieChart,
    TitleComponent,
    TooltipComponent,
    LegendComponent,
+   LabelLayout,
  ]);