报错信息

Uncaught ReferenceError- Vue is not defined

报错代码示例

<body>

  <div id="app">

    <span>{{ username }}</span>

  </div>

  <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>

  <!-- <script src="https://cdn.jsdelivr.net/npm/vue@2"></script> -->

  <script>

    const vm = new Vue({

      el: '#app',

      data: {

        username: 'zhangsan'

      }

    })

  </script>

</body>

问题解决

① 网上说法

  网上是说法是什么new Vue的Vue要大写开头、什么没引入vue文件等等，单貌似都没有问题。

② 尝试解决

  迫于无奈，我不得不为一个测试案例引入一个离线的vue，结果成功了。

  <script src="./lib/vue-2.6.14.js"></script>

③ 问题分析

  vue2官方文档的vue文件是挂载在 jsdelivr 这个CDN上的。然而在2021年12月20日，JsDelivr不再提供国内CDN加速改为全球加速。

  所以导致vue文件加载失败，从而发生报错。

④ 解决方法

  • 使用离线下载的vue文件
  • 使用其他的CDN（BootCDN、Staticfile、unpkg等等）

总结发现

  通过查阅vue2官方文档和vue3的官方文档，细心的人可能已经发现，vue3官方文档已经将vue文件转而挂载在 unpkg 上了

<script src="https://unpkg.com/vue@3"></script>

Uncaught ReferenceError: Vue is not defined（之一）的更多相关文章

  1. Uncaught ReferenceError: XXX is not defined

    Uncaught ReferenceError: XXX is not defined 这个问题困扰我很久,虽然找到了解决方法,但是还不是很明白. 如下所示:是报错的代码. 如果把它改成下面的形式就可 ...

  2. Uncaught ReferenceError: WebForm_DoPostBackWithOptions is not defined

    环境:Asp.Net网站,Framework版本4.0,IIS版本7.0问题:按钮失效,下面是按钮代码: <a id="dnn_ctr1161_Login_Login_DNN_cmdL ...

  3. clipboard复制剪贴板功能，以及用requirejs时报错---Uncaught ReferenceError: Clipboard is not defined

    zeroclipboard是走的flash插件,手机浏览器是不支持的,所以不得不舍弃之,用clipboard,clipboard不需要flash就可以完成复制剪切等功能,而且可以兼容pc,移动端,下面 ...

  4. JS问题Uncaught ReferenceError:XXXX is not defined

    背景: html中一个table,table中进行分页.每行后面有一系列操作,如删除,修改.现在以删除为例说明问题. 实现方式: 使用button,在onclick中调用js函数,js函数中传递参数如 ...

  5. stickUp.js:98 Uncaught ReferenceError: vartop is not defined at HTMLDocument.<anonymous> (stickUp.js:98)

    附加var vartop = 0;在var topMargin = 0;这之后,这里是我附加的代码:$(document).ready(function(){ var contentButton = ...

  6. 简说chart2.4的应用，以及Uncaught ReferenceError : require is not defined的解决

    51呢最近在学习chart.js,然后呢就照着中文的帮助文档来然后就一直出Uncaught ReferenceError : require is not defined的问题查了挺多才知道是帮助文档 ...

  7. ext.net在使用水晶报表时页面无数据显示，并报错误Uncaught ReferenceError: bobj is not defined.

    一.错误描述 在公司做项目的时候,有时会需要用到水晶报表显示数据,水晶报表在ASP.NET中使用时没有问题,winform项目开发也没有问题,但是在ext.net开发使用时却报错了,错误:Uncaug ...

  8. Android JS桥交互（"Uncaught ReferenceError: xxx is not defined or xxx has no method"）

    网上android和js交互的代码有不少,也很容易搜到.最近在做的项目需要用到js桥,遇到了一些问题,记录下来,希望以后遇到能马上解决掉. 一开始我找的demo是从这个:http://blog.csd ...

  9. Uncaught ReferenceError: jQuery is not defined

    页面调试时,明明引入了JQ文件,却一直提示Uncaught ReferenceError: jQuery is not defined错误. 转自:http://blog.csdn.net/baicp ...

  10. Uncaught ReferenceError: layer is not defined

    错误详细信息,如下: Uncaught ReferenceError: layer is not defined' 关键词就是not defined 未定义,那么解决方案就是给它定义. 原来的问题代码 ...

随机推荐

  1. 部署spingboot项目到云服务器踩坑记录

    按教程部署mall电商系统 https://www.macrozheng.com/mall/deploy/mall_deploy_docker.html#docker环境安装 只记录SpringBoo ...

  2. SQL SERVER提示pre-login handshake failed错误的一种解决方法。

    昨天在客户那里,遇到一个奇怪的问题.程序直接运行的时候,可以正常连接SQL SERVER; 但是使用Web Service连接SQL SERVER的时候,出现了下面的错误信息: Connection ...

  3. vue实现记录分享是否有上级

    前言: 项目需要做活动分享功能(增加网站.app等访问量),但是,,,无功不受禄,也就需要分享时带上级ID,好友中奖,本人也受同样优惠 需求开发: 开发一个活动后,本人参加之后,分享给好友,增加自身中 ...

  4. Property or method "scope" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components

    报错如下 属性或方法"范围"不是在实例上定义的,而是在呈现期间引用的. 通过初始化属性,确保此属性是反应性的,无论是在数据选项中,还是对于基于类的组件. 原因在template中未 ...

  5. 青少年CTF-从尾看到头[WP]

    一 题目描述 二 解题步骤 2.1第一层压缩包 压缩包打开提示出错 010editor中观察文件格式,文件尾明显观察到是正常压缩包的逆序,考虑逆序读取生成一个新的zip python代码 with o ...

  6. kubernetes service服务发现两种方式

    service服务发现ClusterIP方式 1.暴露deployment服务 kubectl expose deployment nginx4 --port=8000 --target-port=8 ...

  7. 利用context组件数据传递

    react的数据传递 是从父级向子级传递的.通过props.如果是很多组件需要的数据,通过props传递会非常麻烦.这个时候可以使用context. context需要可以类似于store但是也不能滥 ...

  8. 简谈CPU峰值性能怎么计算[转载]

    CPU峰值性能就是CPU运算能力满打满算最最理想情况下的性能,这只有理论意义,实际性能要以软件实测为准.有人问寡人峰值性能怎么算,这里就很简单地说两句.搞计算化学的一般只关注浮点性能,所以这里只提峰值 ...

  9. hexo博客重新部署

    date: 2020-08-04 updated: 2020-12-31 summary: 博客重新部署到国内Gitee(加速访问速度) hexo博客重新部署(从GitHub到Gitee) (博客迁移 ...

  10. java开发微信APP支付

    直接上代码 String nonce_str=WXPayUtil.generateNonceStr(); //WXPayUtil微信自己有的,自己下载,这里是生成随机字符串,下载地址(下载java的里 ...