解决VUE 在IE下出现ReferenceError: Promise未定义的问题

问题原因:

IE一些低版本的浏览器对于ES6语法不支持

Promise是es6语法里为了解决异步函数多重嵌套的问题(回调地狱)

说明: 或许你并不没有使用Promise,但是有可能你使用Axios等,其中原理也是Promise,进行了封装而已

解决办法:

步骤一:

安装 babel polyfill

npm install --save babel-polyfill

如果你使用的是yarn安装的话:

yarn add babel-polyfill

备注: 使用yarn 安装的话不需要加–save 现在都会默认携带, 加上会不识别

步骤二: 配置build文件夹下webpack.base.conf.js文件,如下图

步骤三: 配置main.js文件

最后，重新运行项目就可以了

npm run dev // npm start或者yarn run dev都可以

这就是我自己遇到的问题，希望可以帮到大家~

补充知识：Nuxt.js 如何做SEO优化?

Nuxt.js 如何做SEO优化?

全局

在nuxt.config.js配置文件中,有个head属性可以设置全局的title,content和keywords等属性

 head: {
 title: pkg.name,
 meta: [
 { charset: 'utf-8' },
 { name: 'viewport', content: 'width=device-width, initial-scale=1' },
 { hid: 'description', name: 'description', content: pkg.description }
 ],
 link: [
 { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
 ]
 },

局部

设置某个单独页面的title和关键字等,首先要找到这个页面的JS代码有一个head()方法,同样可以进行一些类似的设置:

head(){
 return{
 title:'豆瓣电影',
 meta:[{
  'name':'keywords',
  'content': '电影、经典电影、热映、电视剧、美剧、影评、电影院、电影票、排行、推荐'
 }]
 }
}

以上这篇解决VUE 在IE下出现ReferenceError: Promise未定义的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • vue中的计算属性和侦听属性

    计算属性 计算属性用于处理复杂的业务逻辑 计算属性具有依赖性,计算属性依赖 data中的初始值,只有当初始值改变的时候,计算属性才会再次计算 计算属性一般书写为一个函数,返回了一个值,这个值具有依赖性,只有依赖的那个值发生改变,他才会重新计算 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewpo

  • vue created钩子函数与mounted钩子函数的用法区别

    1:在使用vue框架的过程中,我们经常需要给一些数据做一些初始化处理,这时候我们常用的就是在created与mounted选项中作出处理. 首先来看下官方解释,官方解释说created是在实例创建完成后呗立即调用. 在这一步,实例已完成以下配置:数据观测 (data observer),属性和方法的运算,watch/event 事件回调.然而,挂载阶段还没开始,$el 属性目前不可见. 这话的意思我觉得重点在于说挂架阶段还没开始,什么叫还没开始挂载,也就是说,模板还没有被渲染成html,也就是这

  • VUE异步更新DOM - 用$nextTick解决DOM视图的问题

    VUE异步更新DOM 首先,Vue 在更新 DOM 时是异步执行的! 所以只要侦听到数据变化,Vue 将开启一个队列,并缓冲在同一事件循环中发生的所有数据变更.如果同一个 watcher 被多次触发,只会被推入到队列中一次.这种在缓冲时去除重复数据对于避免不必要的计算和 DOM 操作是非常重要的.然后,在下一个的事件循环"tick"中,Vue 刷新队列并执行实际 (已去重的) 工作.Vue 在内部对异步队列尝试使用原生的 Promise.then.MutationObserver 和

  • vue 判断页面是首次进入还是再次刷新的实例

    我就废话不多说了,大家还是直接看代码吧~ <template> <div> 判断页面是首次进入还是再次刷新 </div> </template> <script> export default { data(){ return{ } }, mounted () { //第一种方法 // if(window.name == ""){ // console.log("首次被加载"); // window.nam

  • vue router-link 默认a标签去除下划线的实现

    我就废话不多说了,大家还是直接看例子吧~ .router-link-active{ text-decoration: none; } vue的router-link默认的a标签点击会有一个阴影 补充知识:vue-router更改router-link点击时样式 默认类:router-link-active:可以通过在样式表中重新定义 基类:linkActiveClass:在创建路由时进行全局配置,linkActiveClass:/配置自定义类/ 以上这篇vue router-link 默认a标签

  • 解决VUE项目使用Element-ui 下拉组件的验证失效问题

    问题描述: 在使用Element-ui组件做项目开发时候有可能会使用下拉框组件,如果下拉框组件的option选项是使用v-if指令遍历的, 这样也没有问题,但是如果加上multiple属性,也就是可以多选 就会出现下拉框验证时失效问题. 问题现象: 如图所示,明明已经选择了选项,可是验证还是为空,因此不能提交请求 解决思路: 如果说找遍组件里的方法都无法获得我们适合使用的,那就要动用原生基本功了 console.log一下v-model在此组件上绑定的属性,你发现你绑定的字符串(一般情况下都是S

  • 使用Vue实现一个树组件的示例

    HTML代码: <!DOCTYPE html> <html> <head> <title>Vue Demo</title> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content

  • 如何利用vue实现波谱拟合详解

    主页面-功能介绍 小白初入职场第一篇总结,废话比较多,求轻喷~ 波谱拟合用来对某种材料或物质的谱图进行识别和分析,每种物质可以有多种成分,每种成分用component1.component2...表示,用Add another component和Remove component来控制每种成分的增加和删除,每种成分由多种原子核构成,即nuclei,用Add nucleus和Remove nucleus来控制每种成分内原子核数量,每新增一个原子核,波谱就会分裂一次,谱峰数量由(1->2->4-&

  • 解决VUE 在IE下出现ReferenceError: Promise未定义的问题

    问题原因: IE一些低版本的浏览器对于ES6语法不支持 Promise是es6语法里为了解决异步函数多重嵌套的问题(回调地狱) 说明: 或许你并不没有使用Promise,但是有可能你使用Axios等,其中原理也是Promise,进行了封装而已 解决办法: 步骤一: 安装 babel polyfill npm install --save babel-polyfill 如果你使用的是yarn安装的话: yarn add babel-polyfill 备注: 使用yarn 安装的话不需要加–save

  • 解决Vue在Tomcat8下部署页面不加载的问题

    最新的项目刚刚用上Vue,遇到很多问题,在Tomcat下部署时出现了页面空白. 问题:路由 mode history 模式在 dev 模式下没有问题,在 build 模式页面空白,但静态资源能正常引用 原因:部署在Tomcat上时并没有在根目录上,而是放置在了子文件夹下面,router 无法找到路径中的组件,所以也就无法渲染了 解决:修改 router 下 index.js 以上这篇解决Vue在Tomcat8下部署页面不加载的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多

  • 解决vue使用vant下拉框van-dropdown-item 绑定title值不变问题

    1.创建vue项目 2.使用vant组件 npm install vant --S 全局引用时在main.js引入 import Vant from 'vant'; import 'vant/lib/index.css'; Vue.use(Vant); 假如你引入之后发现页面的样式和组件都挂载了,但是console控制台会报错,说xxxx组件没有register,这个时候很有可能是你的vant插件版本有问题,重新下载一个最新的vant就可以了,现在是2.6.0版本 好,接下来继续 在需要使用下拉

  • 解决Vue 通过下表修改数组,页面不渲染的问题

    需要注意的是,Vue之所以能够监听Model状态的变化,是因为JavaScript语言本身提供了Proxy或者Object.observe()机制来监听对象状态的变化.但是,对于数组元素的赋值,却没有办法直接监听,因此,如果我们直接对数组元素赋值: vm.todos[0] = { name: 'New name', description: 'New description' }; 会导致Vue无法更新View. 正确的方法是不要对数组元素赋值,而是更新: vm.todos[0].name =

  • 解决vue项目nginx部署到非根目录下刷新空白的问题

    1.修改config/index.js 2.修改路由route/index 3.后台配置nginx 以上这篇解决vue项目nginx部署到非根目录下刷新空白的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • 快速解决vue在ios端下点击响应延时的问题

    在apicloud开发中遇到的问题:用vue.js的点击事件,安卓点击响应迅速而ios点击响应有延时(大约300ms). 解决方案如下: 引入<script type="text/javascript" src="/js/mobile/fastclick.js"></script> 然后在页面加载时,使用 $(function() { FastClick.attach(document.body); }); 以上这篇快速解决vue在ios端下

  • 解决Vue+Electron下Vuex的Dispatch没有效果问题

    解决Vue+Electron下Vuex的Dispatch没有效果问题

    这个问题是解决基于 vue 和 electron 的开发中使用 vuex 的 dispatch 无效的问题,即解决了 Please, don't use direct commit's, use dispatch instead of this. 问题. 先允许我梳理一下目录结构,以便阅读的时候不会一头雾水,你到底说的这个文件是哪个-- 其中 /src/main 是存放主配置文件的,/src/render 下面有 store.router.components 等. components 下面就

  • 解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题

    问题截图: 解决方案: 1.打开File --> Setting 窗口 2.搜索 Webpack 3.选择如下路径 总结 以上所述是小编给大家介绍的解决Idea.WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的.在此也非常感谢大家对我们网站的支持! 如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

  • 解决vue动态下拉菜单 有数据未反应的问题

    问题出现在当时后台数据会返回到data中但是没有出现下拉菜单,查询资料 发现 Vue的this理解有误 jsp 下拉菜单 <select name="plantModelParentId" v-model="vueObj.plantModelParentId" @change="selectChange"> <option value=""></option> <option v-fo

随机推荐