我有一个应用程序，其中有其他网页的工作，我试图添加一个网页与图表。尝试它，我作出了改变，包括包

"dependencies": {
"@aws-amplify/ui-vue": "^0.2.8",
"aws-amplify": "^3.0.18",
"aws-amplify-vue": "^2.1.1",
"slugify": "^1.4.0",
"vue": "^2.5.2",
"chart.js": "^2.9.4",
"vue-chartjs": "^4.0.0",
"vue-router": "^3.0.1",
"vuex": "^3.6.2"

字符串
}，
我还使用以下代码创建了一个vue文件

<template>
 <Bar
:chart-options="chartOptions"
:chart-data="chartData"
:chart-id="chartId"
:dataset-id-key="datasetIdKey"
:plugins="plugins"
:css-classes="cssClasses"
:styles="styles"
:width="width"
:height="height"
 />
</template>


<script>

import { Bar } from 'vue-chartjs/legacy'

import { Chart as ChartJS, Title, Tooltip, Legend, BarElement, CategoryScale, LinearScale } from 'chart.js'

ChartJS.register(Title, Tooltip, Legend, BarElement, CategoryScale, LinearScale)

export default {
name: 'BarChart',
components: { Bar },
props: {
chartId: {
  type: String,
  default: 'bar-chart'
},
datasetIdKey: {
  type: String,
  default: 'label'
},
width: {
  type: Number,
  default: 400
},
height: {
  type: Number,
  default: 400
},
cssClasses: {
  default: '',
  type: String
},
styles: {
  type: Object,
  default: () => {}
},
plugins: {
  type: Array,
  default: () => []
}
},
data() {
return {
  chartData: {
    labels: [ 'January', 'February', 'March' ],
    datasets: [ { data: [40, 20, 12] } ]
  },
  chartOptions: {
    responsive: true
  }
  }
  }
  }
 </script>

型
我按照here的例子，并根据其他帖子的建议稍微改变了版本。
Error in ./node_modules/vue-chartjs/legacy/index.js模块解析失败：意外令牌（36：8）您可能需要适当的加载器来处理此文件类型。|};| setChartDatasets（nextData，{|数据|}，getIdKey）;
./node_modules/chart.js/dist/chart.mjs中的错误模块解析失败：意外的令牌（7082：12）