echarts init 报错

最新推荐文章于 2025-05-06 13:55:49 发布

原创最新推荐文章于 2025-05-06 13:55:49 发布 · 906 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#echarts #vue.js #javascript

在Vue项目中使用Echarts时，由于Echarts模块没有default导出，直接使用`importechartsfromecharts`会导致echarts为undefined。正确做法是使用`import*asechartsfromecharts`，这样可以访问到echarts的命名导出，避免init等方法调用时报错。

js:619 [Vue warn]: Error in mounted hook: "TypeError: Cannot read properties of undefined (reading 'init')"

将

import echarts from 'echarts'

换成

import * as echarts from 'echarts';就行了

因为:import echarts from 'echarts' 会将 echarts 解析为一个 default export
但是 echarts 没有 default export,它只有 named exports
所以 import echarts 会导致 echarts 被解析为 undefined,导致后续调用 echarts.init() 报错。而 import * as echarts 会将 echarts 解析为一个命名空间,echarts 上的属性需要通过 echarts.属性名访问。这符合 echarts 的模块导出方式,所以不会报错。