Vue引入Echarts报错 import * as echarts from “echarts“;

项目场景:

已经下载好echarts
cnpm i echarts

Vue引入Echarts

import echarts from 'echarts' mounted() {this.myChart = echarts.init(document.querySelector('.right'))this.myChart.setOption({title: {text: '消费列表',left: 'center'},...

问题描述

在这里插入图片描述


原因分析:

根据警告

 warning  in ./src/App.vue?vue&type=script&lang=js&export 'default' (imported as 'echarts') was not found in 'echarts' (possible exports: Axis, ChartView, ComponentModel, ComponentView, ListntView, extendSeriesModel, format, getCoordinateSystemDimensions, getInstanceByDot, disconnect, dispose, env, extendChartView, extendComponm, getInstanceById, getMap, graphic, helper, init, innerDrawElementOnCanvas, matrnsions, getInstanceByDom, getInstanceById, getMap, graphicix, number, parseGeoJSON, parseGeoJson, registerAction, registerCoordinateSystem,son, registerAction, registerCoordinateSystem, registerLay registerLayout, registerLoading, registerLocale, registerMap, registerPostInit, Update, registerPreprocessor, registerProcessor, registerT
registerPostUpdate, registerPreprocessor, registerProcessor, registerTheme, regisr, setPlatformAPI, throttle, time, use, util, vector, versterTransform, registerUpdateLifecycle, registerVisual, setCanvasCreator, setPlatformAPI, throttle, time, use, util, vector, version, zrUtil, zrender)

怀疑是导包有问题


解决方案:

更改引入方式

import * as echarts from "echarts";

import echarts from 'echarts'import * as echarts from "echarts" 都是用于导入echarts库的语法,但它们有一些区别。

  1. import echarts from 'echarts' 表示你只导入echarts库的默认输出(default export),这通常是一个包含了echarts的主要功能的对象。在这种情况下,你可以使用echarts作为一个对象来引用echarts的功能和方法,例如:
echarts.init();
echarts.setOption();
  1. import * as echarts from "echarts" 表示你导入了echarts库中的所有导出(exports),并将它们作为一个命名空间对象(namespaced object)存储在echarts变量中。这意味着你需要通过命名空间来访问echarts的功能和方法,例如:
echarts.init();
echarts.setOption();

使用这种方式导入echarts可以避免与其他可能的命名冲突,因为你现在需要使用echarts.init()echarts.setOption()等全名来访问echarts的功能。

无论是使用import echarts from 'echarts'还是import * as echarts from "echarts",你都可以使用echarts库的所有功能。选择哪种导入方式取决于你的个人偏好和项目的需求。

希望这个解释能够帮助你理解两者之间的区别。如果你有其他问题,请随时提问。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/40484.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【100天精通python】Day38:GUI界面编程_PyQT从入门到实战(中)

目录 专栏导读 4 数据库操作 4.1 连接数据库 4.2 执行 SQL 查询和更新: 4.3 使用模型和视图显示数据 5 多线程编程 5.1 多线程编程的概念和优势 5.2 在 PyQt 中使用多线程 5.3 处理多线程间的同步和通信问题 5.3.1 信号槽机制 5.3.2 线程安全的数据访问 Q…

日常BUG——通过命令行创建vue项目报错

😜作 者:是江迪呀✒️本文关键词:日常BUG、BUG、问题分析☀️每日 一言 :存在错误说明你在进步! 一、问题描述 在使用vue命令行创建一个vue项目时,出现一下的错误: vue create my…

UDP数据报结构分析(面试重点)

在传输层中有UDP和TCP两个重要的协议,下面将针对UDP数据报的结构进行分析 UDP结构图示 UDP报头结构的分析 UDP报头有4个属性,分别是源端口,目的端口,UDP报文长度,校验和,它们都占16位2个字节,所…

【java面向对象中static关键字】

提纲 static修饰成员变量static修饰成员变量的应用场景static修饰成员方法static修饰成员方法的应用场景static的注意事项static的应用知识:代码块static的应用知识:单例设计模式 static静态的意思,可以修饰成员变量,成员方法&a…

FPGA_学习_14_第一个自写模块的感悟和ila在线调试教程与技巧(寻找APD的击穿偏压)

前一篇博客我们提到了,如果要使用算法找到Vbr,通过寻找APD采集信号的噪声方差的剧变点去寻找Vbr是一个不错的方式。此功能的第一步是在FPGA中实现方差的计算,这个我们已经在上一篇博客中实现了。 继上一篇博客之后,感觉过了很久了…

【Image captioning】ruotianluo/self-critical.pytorch之1—数据集的加载与使用

【Image captioning】ruotianluo/self-critical.pytorch之1—数据集的加载与使用 作者:安静到无声 个人主页 数据加载程序示意图 使用方法 示例代码 #%%from __future__ import absolute_import from __future__ import division from __future__ import print_…

开源,微信小程序 美食便签地图(FoodNoteMap)的设计与开发

目录 0 前言 1 美食便签地图简介 2 美食便签地图小程序端开发 2.1技术选型 2.2前端UI设计 2.3主页界面 2.4个人信息界面 2.5 添加美食界面 2.6美食便签界面 2.8 美食好友界面 2.9 美食圈子界面 2.10 子页面-店铺详情界面 2.11 后台数据缓存 2.12 订阅消息通知 2.1…

探索区块链世界:去中心化应用(DApp)的崭新前景

随着科技的不断发展,区块链技术逐渐引领着数字时代的潮流。在这个充满创新和变革的领域中,去中心化应用(DApp)成为了备受瞩目的焦点。DApp 不仅改变了传统应用程序的范式,还在金融、社交、游戏等多个领域展现出了广阔的…

GRPC 链接 NODE 和 GOLANG

GRPC 链接 NODE 和 GOLANG GRPC 了解 什么是GRPC gRPC 采用了 Protocol Buffers 作为数据序列化和反序列化的协议,可以更快速地传输数据,并支持多种编程语言的跨平台使用gRPC 提供“统一水平层”来对此类问题进行抽象化。 开发人员在本机平台中编写专…

打造专属照片分享平台:快速上手Piwigo网页搭建

文章目录 通过cpolar分享本地电脑上有趣的照片:部署piwigo网页前言1.Piwigo2. 使用phpstudy网页运行3. 创建网站4. 开始安装Piwogo 总结 🍀小结🍀 🎉博客主页:小智_x0___0x_ 🎉欢迎关注:&#x…

深度学习1:通过模型评价指标优化训练

P(Positive)表示预测为正样本,N(negative)表示预测为负样本,T(True)表示预测正确,F(False)表示预测错误。 TP:正样本预测正确的数量(正确检测) FP:负样本预测正确数量(误检测) TN…

卷积神经网络CNN

卷积神经网络CNN 1 应用领域1 检测任务2 分类和检索3 超分辨率重构4 医学任务5 无人驾驶6 人脸识别 2 卷积的作用3 卷积特征值计算方法4 得到特征图表示5 步长和卷积核大小对结果的影响1 步长2 卷积核 6 边缘填充方法7 特征图尺寸计算与参数共享8 池化层的作用9 整体网络架构10…

【GitLab私有仓库】如何在Linux上用Gitlab搭建自己的私有库并配置cpolar内网穿透?

文章目录 前言1. 下载Gitlab2. 安装Gitlab3. 启动Gitlab4. 安装cpolar5. 创建隧道配置访问地址6. 固定GitLab访问地址6.1 保留二级子域名6.2 配置二级子域名 7. 测试访问二级子域名 前言 GitLab 是一个用于仓库管理系统的开源项目,使用Git作为代码管理工具&#xf…

软考笔记——10.项目管理

进度管理 进度管理就是采用科学的方法,确定进度目标,编制进度计划和资源供应计划,进行进度控制,在与质量、成本目标协调的基础上,实现工期目标。 具体来说,包括以下过程: (1) 活动定义&#…

HLS实现FIR低通滤波器+System Generator仿真

硬件:ZYNQ7010 软件:MATLAB 2019b、Vivado 2017.4、HLS 2017.4、System Generator 2017.4 1、MATLAB设计低通滤波器 FPGA系统时钟 50MHz,也是采样频率。用 MATLAB 生成 1MHz 和 10MHz 的正弦波叠加的信号,并量化为 14bit 整数。把…

Web网页浏览器远程访问jupyter notebook服务器【内网穿透】

文章目录 前言1. Python环境安装2. Jupyter 安装3. 启动Jupyter Notebook4. 远程访问4.1 安装配置cpolar内网穿透4.2 创建隧道映射本地端口 5. 固定公网地址 前言 Jupyter Notebook,它是一个交互式的数据科学和计算环境,支持多种编程语言,如…

Hyper-v导致Vmware window无法启动崩溃记录

最近有几次vmware启动window10直接崩溃情况,显示蓝屏报错。一开始没在意,以为是因为固态硬盘错了几个字节导致的? 但后来想想不对啊。vmware用了也有10来年了,稳得一笔,在仔细思考了一下后发现打不开的win10这三个虚拟…

设计模式之构建器(Builder)C++实现

1、构建器提出 在软件功能开发中,有时面临“一个复杂对象”的创建工作,该对象的每个功能接口由于需求的变化,会使每个功能接口发生变化,但是该对象使用每个功能实现一个接口的流程是稳定的。构建器就是解决该类现象的。构建就是定…

【Java】项目管理工具Maven的安装与使用

文章目录 1. Maven概述2. Maven的下载与安装2.1 下载2.2 安装 3. Maven仓库配置3.1 修改本地仓库配置3.2 修改远程仓库配置3.3 修改后的settings.xml 4. 使用Maven创建项目4.1 手工创建Java项目4.2 原型创建Java项目4.3 原型创建Web项目 5. Tomcat启动Web项目5.1 使用Tomcat插件…

【CTF-web】备份是个好习惯(查找备份文件、双写绕过、md5加密绕过)

题目链接:https://ctf.bugku.com/challenges/detail/id/83.html 经过扫描可以找到index.php.bak备份文件,下载下来后打开发现是index.php的原代码,如下图所示。 由代码可知我们要绕过md5加密,两数如果满足科学计数法的形式的话&a…