Fork me on GitHub

Uncaught ReferenceError- Vue is not defined问题

  今天在整理电脑文件时,无意间发现了一个我学习vue2的一个报错问题。本来是不打算记录的,但想想还是记录一下。

报错信息

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>
posted @ 2022-09-04 10:58  Lencamo  阅读(603)  评论(0编辑  收藏  举报