解决H5、vue等项目在微信内置浏览器，微信端、ie某些浏览器打开白屏问题

问题描述：

微信公众号通过链接打开vue页面遇到白屏问题，通过排查，发现是某些微信浏览器版本过低导致，而此时项目中使用到了es6，es7等语法，导致浏览器无法解析

解决方法：

一、针对vue版本@3.x

直接在根目录下添加.babelrc文件即可

{"presets": [["@vue/cli-plugin-babel/preset"]],"plugins": []
}

二、针对vue版本@4.x

// 1.安装bebel进行es6转es5
npm install babel-preset-es2015

同时在根目录下添加.babelrc文件，配置如下

{"presets": [["@babel/preset-env", { "modules": false }]],"plugins": []
}

此时可能会报错，如有报错还需安装

npm i @babel/preset-env -D

综上针对vue@3.x和vue@4.x都可用的.babelrc配置如下

{"presets": [["@vue/cli-plugin-babel/preset"],["@babel/preset-env", { "modules": false }]],"plugins": []
}

最后重新启动项目即可

解决H5、vue等项目在微信内置浏览器，微信端、ie某些浏览器打开白屏问题相关推荐

实现地图功能利用微信内置的微信地图
效果图: 查看微信开发文档:https://developers.weixin.qq.com/miniprogram/dev/api/location/wx.chooseLocation.html 其 ...
vue支付宝html,vue 解决在微信内置浏览器中调用支付宝支付的情况
我的思路大概是这样的 1. 验证是否是在微信内置浏览器中调用支付宝 2.给支付页面的url加上调用接口所需的参数(因为在微信里是不能直接调用支付宝的需要调用外部浏览器) 3.在外部浏览器中完成支付跳转 ...
微信公众号 - 实现 H5 网页在微信内置浏览器中下载文件，可预览和下载 office 文件（doc / xls / ppt / pdf 等）适用于任何前端技术栈网站，兼容安卓和苹果系统！
前言网上的教程都是让你写页面 "引导" 右上角三个点里,让用户自己去浏览器打开,其实这样用户体验并不好. 本文实现了最新微信公众号 H5 网页(微信内置浏览器中),预览下载 o ...
php h5页面微信登录页面,客户端，微信内置浏览器加载H5页面字体变大问题
在开发当中呢,经常会有很多H5的小活动页面,需要在微信的环境下使用.偶尔会出现H5页面在微信或者其他客户端中出现字体变大的问题,下面提供解决方法. 首先先把网页自动放大放小的关掉. 安卓解决微信内置浏 ...
仿抖音视频自动播放html,vue 仿抖音视频列表（兼容微信内置X5浏览器）
制作仿抖音视频列表遇到很多坑,特别是安卓微信内置浏览器,让人脑壳疼,核心代码不多便于理解组件用到了vant 中的swiper滑动组件 h5 原生 video 属性 webkit-playsinl ...
微信公众号H5点击图片预览(可放大缩小)，用微信内置jssdk实现
在微信公众号H5里面可能会遇到点击图片预览,还可以放大缩小,微信内置有这个功能可以实现用vue写项目的话,先 cnpm install weixin-js-sdk --save 接着给图片一个点击事 ...
vue仿抖音视频列表（兼容微信内置X5浏览器）
vue 仿抖音视频列表(兼容微信内置X5浏览器)https://blog.csdn.net/superKM/article/details/87603255制作仿抖音视频列表遇到很多坑,特别是安卓微 ...
《解决微信内置浏览器返回上一页强制刷新问题方法》
<解决微信内置浏览器返回上一页强制刷新问题方法> 参考文章: (1)<解决微信内置浏览器返回上一页强制刷新问题方法> (2)https://www.cnblogs.com/li ...
解决微信内置浏览器tel:手机号不能打电话的问题
正常的唤起设备的打电话功能,这样写就可以了 <a href="tel:13045678901">拨号</a> 但是在微信内置浏览器中这个功能好像是被屏蔽掉了 ...
html5 微信返回按钮,《解决微信内置浏览器返回上一页强制刷新问题方法》(示例代码)...
微信内置浏览器在返回上一页面,且上一页面包含AJAX代码时,页面就会被强制刷新,极度影响用户体验.而我们想要的效果是:返回上一页面时,页面还停留在原来的状态,AJAX获取到的数据还在,滚动条也在原来的 ...

解决H5、vue等项目在微信内置浏览器，微信端、ie某些浏览器打开白屏问题

问题描述：

微信公众号通过链接打开vue页面遇到白屏问题，通过排查，发现是某些微信浏览器版本过低导致，而此时项目中使用到了es6，es7等语法，导致浏览器无法解析

解决方法：

一、针对vue版本@3.x

直接在根目录下添加.babelrc文件即可

二、针对vue版本@4.x

同时在根目录下添加.babelrc文件，配置如下

此时可能会报错，如有报错还需安装

综上针对vue@3.x和vue@4.x都可用的.babelrc配置如下

最后重新启动项目即可

解决H5、vue等项目在微信内置浏览器，微信端、ie某些浏览器打开白屏问题相关推荐

最新文章

热门文章

解决H5、vue等项目在微信内置浏览器，微信端、ie某些浏览器打开白屏问题

问题描述：

微信公众号通过链接打开vue页面遇到白屏问题，通过排查，发现是某些微信浏览器版本过低导致，而此时项目中使用到了es6，es7等语法，导致浏览器无法解析

解决方法：

一、针对vue版本@3.x

直接在根目录下添加.babelrc文件即可

二、针对vue版本@4.x

同时在根目录下添加.babelrc文件，配置如下

此时可能会报错，如有报错还需安装

综上针对vue@3.x和vue@4.x都可用的.babelrc配置如下

最后 重新启动项目即可

解决H5、vue等项目在微信内置浏览器，微信端、ie某些浏览器打开白屏问题相关推荐

最新文章

热门文章

最后重新启动项目即可