"TypeError: chart_js__WEBPACK_IMPORTED_MODULE_9__.default不是构造函数“

Question

我试图在Vue组件中使用Chart.js v3.3.2 (因为我需要使用一个需要v3的插件)，并且我遵循说明和博客帖子，但是我得到了以下错误：

Error in mounted hook: "TypeError: chart_js__WEBPACK_IMPORTED_MODULE_9__.default is not a constructor"

相关的代码(只是试图让它开始工作)如下：

<template>
    <canvas id="myChart" />
<template>

<script>
import Chart from 'chart.js'

export default {
    mounted() {
            const ctx = document.getElementById('myChart');
            const stars = [135850, 52122, 148825, 16939, 9763];
            const frameworks = ['React', 'Angular', 'Vue', 'Hyperapp', 'Omi'];
            new Chart(ctx, {
                type: 'line',
                data: {
                    labels: frameworks,
                    datasets: [
                        {
                            label: "Github Stars",
                            data: stars,
                            backgroundColor: "rgba(255, 99, 132, 0.2)",
                            borderColor: "rgba(255, 99, 132, 1)",
                            borderWidth: 1
                        }
                    ]
                }
            })

    }

}

Chart是库中的默认导出，因此它看起来不需要在导入中进行重构。这是个窃听器，还是我做错了什么？

Answer 1

根据部分中的官方文档，您可以这样做：

最后，有一条单独的路径可以为您完成上述工作，在一行中： import Chart from 'chart.js/auto'