【问题+解决】axios/vue/element/echarts引入报错

缘由

笔者在html页面引用vue来快速实现页面;<head></head>中通过<script>src=""></script>方法引入,开始引入,应用都是正常,后来用了也没问题;奇怪的是,前几天发现html页面无法出现效果图
更新线上项目发现,html页面加载慢;接口请求超时;页面样式也出现了问题;

当时的引入unpkg

<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<script src="https://unpkg.com/vue@2/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.min.js"></script>

排查

经过排查就是这种的引入方式失效了,引入当时也是根据官方文档引入的,纳闷了,之前还好好的,怎么突然出问题了;
在这里插入图片描述
排查发现这种的引入不是正确的,记得之前引入,是cdn,排查发下,它的引入方式是unpgk,进而导致的

正确的引入cdn

替换内容
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui/lib/theme-chalk/index.css">
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/element-ui/lib/index.js"></script>
<script src="http://cdn.jsdelivr.net/npm/axios@0.19.0/dist/axios.min.js"></script>
<script src="https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.min.js"></script>

大家想用直接复制就行。

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui/lib/theme-chalk/index.css"><script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui/lib/index.js"></script><script src="http://cdn.jsdelivr.net/npm/axios@0.19.0/dist/axios.min.js"></script><script src="https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.min.js"></script>

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

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

相关文章

Docker registry镜像仓库,私有仓库及harbor管理详解

目录 registry镜像仓库概述 Docker 镜像仓库&#xff08;Docker Registry&#xff09;&#xff1a; registry 容器&#xff1a; 私有仓库概述 搭建本地私有仓库示例 Harbor概述 harbor架构 详解构成 Harbor由容器构成 Harbor部署示例 环境准备 部署Docker-Compose服…

Elasticsearch8 集群搭建(二)配置篇:(1)节点和集群配置

安装完Elasticsearch后&#xff0c;需要对其进行配置&#xff0c;包括以下几部分&#xff1a;节点和集群配置、系统配置、安全配置。 此篇记录节点和集群配置的内容&#xff0c;后续将更新系统配置和安全配置。 节点和集群配置&#xff1a; 通过编辑/usr/local/elasticsearc…

【STM32调试】寄存器调试不良问题记录持续版

STM32寄存器调试不良问题记录 NVIC&#xff08;内嵌的中断向量控制器&#xff09;EXTI&#xff08;外部中断/事件&#xff09; 记录一些stm32调试过程中&#xff1a;不易被理解、存在使用误区、不清不楚、是坑、使用常识等方面的一些记录。本记录只包含stm32的内核以及外设等寄…

用时序数据库 DolphinDB 搭建一套轻量化工业试验平台解决方案

DolphinDB 作为集成了高容量高速度流数据分析系统和强大编程语言的一站式解决方案&#xff0c;旨在为用户提供快速存储、检索、分析和计算庞大的结构化数据服务。本文将提供一个轻量化的工业试验平台数据处理解决方案&#xff0c;快速简单地实现海量数据采集、存储、处理和分析…

7.5 MySQL对数据的增改删操作(❤❤❤)

7.5 MySQL对数据的基本操作 1. 提要2. 数据添加2.1 insert语法2.2 insert 子查询2.3 ignore关键字 3. 数据修改3.1 update语句3.2 update表连接 4. 数据删除4.1 delete语句4.2 delete表连接4.3 快速删除数据表全部数据 1. 提要 2. 数据添加 2.1 insert语法 2.2 insert 子查询 …

OpenJDK 和 OracleJDK 哪个jdk更好更稳定,正式项目用哪个呢?关注者

OpenJDK 和 OracleJDK&#xff1a;哪个JDK更好更稳定&#xff0c;正式项目应该使用哪个呢&#xff1f;我会从&#xff0c;从开源性质、更新和支持、功能差异等方面进行比较&#xff0c;如何选择&#xff0c;哪个jdk更好更稳定&#xff0c;正式项目用哪个呢&#xff0c;进行比较…

【Qt之模型视图】1. 模型和视图架构

1. 模型/视图架构是什么及有什么用 MVC&#xff08;Model-View-Control&#xff09;是一种源自Smalltalk的设计模式&#xff0c;通常用于构建用户界面。 MVC由三种类型的对象组成。模型是应用对象&#xff0c;用来表示数据&#xff1b;视图是模型的用户界面&#xff0c;用来显…

openssl3.2 - 官方demo学习 - test - certs

文章目录 openssl3.2 - 官方demo学习 - test - certs概述笔记.sh的执行语句打印的方法要修改的实际函数END openssl3.2 - 官方demo学习 - test - certs 概述 官方demos目录有证书操作的例子 已经做了笔记 openssl3.2 - 官方demo学习 - certs 但是这个demos/certs目录的脚本,…

VC++中使用OpenCV读取图像、读取本地视频、读取摄像头并实时显示

VC中使用OpenCV读取图像、读取本地视频、读取摄像头并实时显示 最近闲着跟着油管博主murtazahassan&#xff0c;学习了一下LEARN OPENCV C in 4 HOURS | Including 3x Projects | Computer Vision&#xff0c;对应的Github源代码地址为&#xff1a;Learn-OpenCV-cpp-in-4-Hour…

智能手表喇叭无气孔导致老化播放后没声音

智能音箱喇叭老化播放后没声音 智能手表要做防水&#xff0c;在外壳上打了防水胶&#xff0c;结果出现播放突然没声音的现象&#xff0e; 原因 一直播放&#xff0c;设备温度升高&#xff0c;因为做了防水密闭导致喇叭腔体气压异常&#xff0c;导致播放没声音&#xff0e; …

ArcGIS初始化软件界面Normal.mxt

ArcGIS有时候永久了&#xff0c;或者呢突然不自觉软件界面乱了&#xff0c;或者一些窗口打开却找不到&#xff01; 这时候可以去删除arcgis的界面配置文件&#xff0c;Normal.mxt 删除后再打开软件&#xff0c;软件界面就会回到初始化设置了&#xff01; 文件所在的路径&…

Git将某个文件合并到指定分支

企业开发中&#xff0c;经常会单独拉分支去做自己的需求开发&#xff0c;但是某些时候一些公共的配置我们需要从主线pull&#xff0c;这时候整个分支merge显然不合适 1.切换至待合并文件的分支 git checkout <branch>2.将目标分支的单个文件合并到当前分支 git checkou…