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>