Vue-cli搭建的webpack微信公众号项目关于兼容IE9以上和iOS11以下白屏问题

最新推荐文章于 2021-06-21 12:23:42 发布
最新推荐文章于 2021-06-21 12:23:42 发布
阅读量548 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cscscssjsp/article/details/83302130
版权

1.兼容性问题

因为采用es6写法，而IE很多版本暂时不支持这种写法，造成打包后白屏问题

vue的js文件放在src下在打包时会自动转为es5格式，但是放在static下的js文件是不会转的，通过IE控制台查看改错

IE和微信浏览器内核版本一致，只要在IE调通了IE能展示页面，微信端基本就没事了

Javacssjsp
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
解决vue build后不兼容IOS11以下版本，并清理index缓存
baibi4079的博客
02-25 395
* build --> webpack.prod.conf.js --> UglifyJsPlugin添加关于mangle的选项 mangle: { safari10: true } *打包好的index.html放到服务器里去的时候，index.html在服务器端可能是有缓存的，这需要在服务器配置不让缓存index.html *nginx...
Css_IE9兼容性问题
weixin_30511039的博客
07-02 353
问题： 　　IE9 css过大时，加载css会加载一部分css内容，处理方式，代码切割。 　　Webpack中使用插件CSSsplitWebpackPlugin()样式切割。 转载于:https://www.cnblogs.com/GongYaLei/p/11118380.html...
IE9对CSS3的支持情况概述
weixin_33913332的博客
09-23 83
译文链接：http://www.impressivewebs.com/css3-support-ie9/
vue x 兼容iphone_微信H5兼容iPhoneX
weixin_39815286的博客
12-20 230
问题抛出，主要是因为iphoneX屏幕的齐刘海和底部滑条带来的一些操作问题。解决方案一(不针对微信H5或者手QH5)1.iPhoneX的适配，在iOS 11中采用了viewport-fit的meta标签作为适配方案；viewport-fit的默认值是auto。关于 viewport-fit1.viewport-fit 有三个可选值：contain:最初的布局视窗和视觉布局视窗被设置为最大的矩形。...
html手机端苹果兼容,关于vue移动端 ios 的兼容问题(二)
weixin_35126737的博客
06-21 648
问题一问题：ios无法的手机浏览器无法解析报错：SyntaxError: Invalid regular expression: invalid group specifier name/(?<={).+?(?=})/ig 类似的正则而且直接干扰代码的运行 也就是说只要你有使用类似的正则 代码直接报错 不会运行问题二问题：ios 白屏不显示,并无报错检查方式：用try{}catch(err)...
在iOS11上出现Web页面无法显示的问题
diankuini1374的博客
08-01 861
内容来源 https://blog.csdn.net/weixin_43883776/article/details/86238958 一个解决方案 https://blog.csdn.net/qq_31490071/article/details/88870973 打了测试环境的包，在iOS11系统上任何wkwebview界面显示都没有什么问题，但是到了iOS10的系统上，或者...
vue-cli+webpack搭建的vue开发环境配置打包文件路径
wuyitong116的博客
05-25 350
使用vue-cli+webpack搭建的vue开发环境 修改默认打包文件路径配置
汇总 vue 移动端 苹果端和安卓端的兼容性问题
青蛙背蝎子过河的博客
12-01 9629
   项目中遇到的苹果safari不兼容的问题太多了.在这里整理一下.希望能帮助到在走弯路的人.        1. 日期格式问题. 这个问题应该是遇到最多的.也是最多被熟知的.safari不识别2018-08-08的日期格式.会显示NaN.          解决方式: 在处理日期之前转换为2018/08/08的格式.        2. 设置了input背景颜色在safari颜色异常显示...
聊聊vue-cli在IE9碰到css样式问题
weixin_34342905的博客
03-25 1560
先说一下项目技术背景，新得项目使用的是vue-cli2.0+，后期发现使用jenkins线上编译很慢，于是把webpack3升级到了4.2，最近项目在做IE9兼容测试，发现很多样式都飞了，小白在本地开发环境进行测试的时候，发现大量css样式无法引入因为之前小白曾使用seajs+underscore + jquery搭建过一套组件结构，知道在IE9-下css选择器数量、文件大小以及style、lin...
vue2+webpack4搭建，开发，打包
daisy_style001的博客
03-19 777
生成了package.json文件之后，安装webpack，vue，loader等相关的包： npm install webpack --save-dev //安装webpack npm install --save-dev webpack-cli //4以后需要 npm i vue -S npm i vue-loader vue-template-compiler -D npm instal...
vue-cli3 ios10白屏问题解决思路
weixin_30952535的博客
09-04 1829
在出现了这个问题之后先不要盲目的去瞎试，根据网上的方法试了个遍也没解决问题 先看报的是什么错，再针对的解决问题 首先出现的报错是SyntaxError: Unexpected token '*' 在打包后的dist文件里搜了下连乘 ** 果然有，说明没有转编译成功 这个错误的出现是由于 ios10 是不支持连乘引起的，如果发现自己的代码里有这个的使用，那最好换下，或者转编译 ...
vue项目打包后首页一片空白解决办法和具体原因总结
吹过麦田的风的专栏
08-20 3万+
很高兴在万千文章中你看到本章，希望能为你解决问题！！！ 在最初用vue+webpack+vue-router做项目的时候，在本地pc开发测试都是正常的，但是在把代码打包部署到测试服务器之后，访问项目首页总是白屏。 第一种，打包后的dist目录下的文件引用路径不对，会因找不到文件而报错导致白屏。 解决办法：修改一下config下面的index.js中bulid模块导出的路径。因为index.h...
Vue单页面在ios10系统上出现白屏的bug
weixin_33754913的博客
10-25 2957
一个bug 你用Vue做了一个单页面应用，它在一切设备上都工作正常，但是突然有一天，你的测试和你说，这个网站在iOS 10上跑不起来，怎么办？ 于是你打开你电脑上的Chrome浏览器，工作正常；打开Safari浏览器，工作正常；打开iOS 11手机，工作正常；打开各种安卓手机，工作正常。但是在iOS 10的手机上，不论是微信浏览器，还是Safari浏览器，都只能看见一个白白的屏幕。 ...
webpack的兼容插件版本--（内附可用配置文件）
晚来天欲雪
06-09 2740
那些年我躺过的配置坑 在webpack的配置过程中，由于对新版本的憧憬，所以一开始就摒弃了老师所用的旧版本，毅然决然安装上了4.0版本。。。从我安装上他的那一刻，我注定要一路踩雷的走下去。 第一个兼容问题就是在4.0版本以上，webpack和webpack-cli是分开安装，但又是相互依赖的。所以，以往3.0版本的直装版在这里并不通用。所以，请在你的项目里为他们留出两个坑。 以上是当前时间，我所...
ios10以下版本无法打开vue页面
guanguan0_0的博客
07-04 4036
使用vue开发公众号的时候遇到，在安卓系统打开页面正常，ios10以上也是正常，但是ios9打开空白。原因是es没有完全被解析。 修改webpack.base.conf.js: entry: { app: ['babel-polyfill', './src/main.js'] }, module: { rules: [ { test...
vue项目踩坑之安卓4,5，ios9页面空白
kayla_wang的博客
05-18 9098
最近在用vue做项目，项目在安卓4,5，ios9页面显示空白，问题解决跟大家分享一下安卓4,5，ios9页面空白原因：低版本不支持es6，需要将es6编译成es5具体解决方法1.npm install --save-dev babel-preset-es2015（安装ES2015转码规则）2.npm install --save-dev babel-polyfill3.mian.js 中引用 im...
vue开发SPA在ios10上的bug
runOnWay的博客
02-07 6793
前端早读课公众号，2018年2月7日内容，认为其很有意义，记录于此 用vue框架开发的SPA在所有的环境下都可以正常显示，除了在ios10的手机上跑不起来，无论是微信浏览器还是Safari浏览器，都只能看到一个白白的屏幕。 手机连接电脑后，在电脑端的Safari里，报错如下： SyntaxError: Cannot declare a let variable twice: ‘e’.
Vue项目webpack打包部署到服务器
热门推荐
Dear_Mr的博客
06-05 7万+
Vue项目webpack打包部署到服务器这篇博文主要说的就是我今天遇到的问题，而且在经过我的询问，好多人在打包部署的时候都遇到了一些问题，下面就来说下，如何将Vue项目放置在服务器上，这里以Tomcat为例。必须要配置的就是/config/index.js在vue-cli webpack的模板下的/config/index.js，我们可以看到assetsPublicPath这个键，并且这个东西还出现
vue build打包之后首页白屏的问题
Lee的博客
12-23 1万+
问题描述 本地的vue项目在server端浏览没问题，但是执行npm run build 打包之后在本地预览是白屏。有很多js,css无法加载。 1.解决方法 在config文件夹中找到index.js打开把assetsPublicPath: '/'改成下图方框中的样子。 2.在build文件夹中打开webpack.prod.conf.js 找到output：增加...
vue-cli-webpack:vue-cli 2.9.6版本初始化webpack工程
最新发布
09-07
vue-cli是一个构建Vue.js工程的脚手架工具，帮助开发者快速搭建和管理Vue.js项目。而vue-cli 2.9.6版本是其一个较早的版本，可以使用它来初始化一个基于webpack的Vue.js工程。 使用vue-cli 2.9.6版本初始化webpack工程，首先需要确保本地已安装了node.js和npm。 在命令行中执行以下命令来安装vue-cli： ``` npm install -g vue-cli@2.9.6 ``` 安装完成后，可以使用以下命令来初始化一个webpack工程： ``` vue init webpack my-project ``` 这里的"my-project"是你自定义的项目名称，可以替换为其他名称。 执行上述命令后，vue-cli会根据webpack模板生成项目的基本结构和文件。 接着，需要进入项目文件夹： ``` cd my-project ``` 然后执行以下命令来安装项目所需的依赖： ``` npm install ``` 安装完成后，可以使用以下命令来启动项目： ``` npm run dev ``` 这样，webpack工程就成功初始化并启动了。通过访问http://localhost:8080，可以在浏览器中查看项目的运行效果。 在初始化的工程中，可以编辑和修改src目录下的文件，这里的主要文件包括App.vue和main.js，分别是Vue组件和入口文件。 总之，使用vue-cli 2.9.6版本初始化webpack工程能够为开发者提供一个基于webpack的Vue.js开发环境，使他们能够更高效地进行Vue.js项目的开发和管理。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值