在nuxt3.js项目中引入echarts5版本和echarts-wordcloud报错

最新推荐文章于 2025-07-21 19:22:34 发布

原创

最新推荐文章于 2025-07-21 19:22:34 发布 · 1.2k 阅读

15 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #echarts #前端

文章讲述了作者在Nuxt3.js项目中引入echarts5和echarts-wordcloud时遇到的错误，通过排查发现wordcloud需要注册后才能使用，最终解决了问题并分享了解决步骤。

今天在nuxt3.js项目中引入echarts5版本和echarts-wordcloud报错，被折磨的要疯掉，必须记录一下~~~~(>_<)~~~~

WordCloudChart does not have an install method

网上查了很多解决方案，按照指示一步一步的排查，echarts-wordcloud版本删了装，装了又删，还是还是不行…

最后我在想，要不要看看node安装包里的echarts-wordcloud包里的README.md，看看里面是怎么写的，说不定有答案。看完以后我发现好像没有说到wordcloud需要注册。莫非只需引入不需注册。把代码改了一下，OK，成了！

<template>
  <div ref="chart" class="word-cloud-chart"></div>
</template>

<script lang="ts">
import {
     
      defineComponent, onMounted, onBeforeUnmount, ref } from 'vue';
import * as echarts from 'echarts/core';
// import { WordCloudChart } from 'echarts/charts';
import {
     
      TooltipComponent, TitleComponent } from 'echarts/components';
import {
     
      CanvasRenderer } from 'echarts/renderers';