我只是迫切地想要一个答案，但在这里有希望找到答案。
我使用了以下材料：

"vite": "^2.7.13",
"highcharts": "^9.3.3",
"highcharts-vue": "^1.4.0"

我想制作一个包含highcharts图表的vue组件库。我试着用如下的汇总配置制作条形图：

import vue from "rollup-plugin-vue";
import typescript from "rollup-plugin-typescript2";
import resolve from "rollup-plugin-node-resolve";
import postcss from "rollup-plugin-postcss";
import dts from "rollup-plugin-dts";
import cleaner from "rollup-plugin-cleaner";
import commonjs from "@rollup/plugin-commonjs";
import peerDepsExternal from 'rollup-plugin-peer-deps-external';
import image from '@rollup/plugin-image';

const plugins = [
  resolve(),
  typescript({
    check: false,
    useTsconfigDeclarationDir: true,
  }),
  vue({
    preprocessStyles: true,
    css: false,
    template: {
      isProduction: true,

    },

  }),
  peerDepsExternal(),
  commonjs(),
  postcss({
    extensions: [".css"],
  }),
  image(),
];

const AppChart = [
  {
    input: "./demo-v3/src/components/Chart.vue",
    output: [
      {
        format: "esm",
        file: "./demo-v3/lib/UI/AppChart/index.js",
      },
    ],
    external: ["@vue"],
    plugins: [...plugins,   commonjs({
      namedExports: {
        "node_modules/highcharts-vue/dist/highcharts-vue.min.js": ["Chart"],
      },
    }),],

  },
];

const config = [...AppChart];

export default config;

我的组件BarChart.vue如下所示：

<template>
  <div class="chart-wrapper">
    <Chart :chart-options="lineChartOptions" />
  </div>
</template>

<script setup lang="ts">
import Chart from "./CommonChart.vue";

const props = defineProps({
  chartData: {
    type: Object,
    // eslint-disable-next-line @typescript-eslint/no-empty-function
    default: () => {},
  },
});

const exportingOptions = () => {
  return {
    buttons: {
      contextButton: {
        menuItems: [
          "viewFullscreen",
          "separator",
          "downloadPNG",
          "downloadPDF",
          "printChart",
          "separator",
          "downloadCSV",
          "downloadXLS",
        ],
      },
    },
  };
};

let lineChartOptions = {
  ...props.chartData,
  exporting: exportingOptions(),
  credits: { enabled: false },
};
</script>

<style lang="scss">
.chart-wrapper {
  padding: 15px;
  width: 1140px;
  height: 440px;
  border: 1px solid #c4c4c4;
}
</style>

而且有一个常见的图表组件看起来像这样：

<template>
  <highcharts class="hc" :options="chartOptions" />
</template>

<script setup lang="ts">
import { Chart as highcharts } from "highcharts-vue";
import Highcharts from "highcharts";

const props = defineProps({
  chartOptions: {
    type: Object,
    // eslint-disable-next-line @typescript-eslint/no-empty-function
    default: () => {},
  },
});
</script>

当我使用BarChart时，它可以工作，但在与汇总绑定后，它就不能工作了。

我能做错什么？