Uncaught ReferenceError: Vue is not defined（之一）
报错信息
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>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 阿里最新开源QwQ-32B，效果媲美deepseek-r1满血版，部署成本又又又降低了！
· 单线程的Redis速度为什么快？
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决：字节Trae VS Cursor，谁才是开发者新宠？
· 展开说说关于C#中ORM框架的用法！