Uncaught ReferenceError: Vue is not defined 当出现这个问

时间:2019-05-11 09:49来源:计算机教程
---恢复内容开始--- 首先要说的是:vue 不支持 IE8 及其以下版本,因为 Vue.js 使用了 IE8不能模拟的 ECMAScript 5特性,比如Object.defineProperty()此方法就会报错,如下图: 在Vue学习的过程中可

---恢复内容开始---

首先要说的是:vue 不支持 IE8 及其以下版本,因为 Vue.js 使用了 IE8 不能模拟的 ECMAScript 5 特性,比如Object.defineProperty()此方法就会报错,如下图:

在Vue学习的过程中可能出现这个情况,未捕获ReferenceError:Vue没有定义,为什么没有定义及找到这个Vue呢,目前说的最多的是“过早关闭脚本标签”,例如这样引用

vnsc5858威尼斯城官网 1

<script> src="http://www.everafterflorals.com/uploads/allimg/190511/09495333Y-1.jpg"</script> 造成了过早关闭,浏览器无法读取这个js,正确的书写应该是

1111.jpg

<script src="http://www.everafterflorals.com/uploads/allimg/190511/09495333Y-1.jpg"></script>
还有一种情况就是引用书写同时放在页面底部,如图

所以,用vue尽量去做那些不需要兼容ie8及其以下版本的浏览器的项目。当然了,也许你有其它方法去兼容ie8,费时费力?自己权衡吧。下边要说的是vue在兼容ie9 ---到 edge这几个版本浏览器上的问题。

vnsc5858威尼斯城官网 2

情况1:

报错:ReferenceError: “Promise”未定义,原因是:Promise是es6的新语法,ie9和一些低版本的高级浏览器对es6新语法并不支持。
解决办法:npm install --save-dev babel-polyfill
babel-polyfill正确安装后,main.js里引用:import "babel-polyfill";

这种情况下的报错只需把标签放到头部即可vnsc5858威尼斯城官网 3

情况2

这个情况是用指令修改页面标题的错误,如下

Vue.directive('title', {
  inserted: function (el, binding) {
    document.title = el.dataset.title
  }
})

ie浏览器提示属性找不到,具体的情况,总之如果要修改页面标题,用别人说的一个方法吧,如下

下载安装插件依赖 
 npm install vue-wechat-title --save  
在main.js中引入插件
 import VueWechatTitle from 'vue-wechat-title' 
 Vue.use(VueWechatTitle)

const router = new Router({
  routes: [{
      path: '/login',
      component: Login,
      meta: { title: '登录' }
    }, {
      path: '/register',
      component: Register,
      meta: { title: '注册' }
    }
  ]
})

在app.vue中修改router-view组件 
<router-view v-wechat-title='$route.meta.title'></router-view>

修改标题就ok了,在ie里也不会报错。

为什么出现这种情况,具有原因还在研究。

 

编辑:计算机教程 本文来源:Uncaught ReferenceError: Vue is not defined 当出现这个问

关键词: