标签：vue babel 汇总 js 白屏 vuex 路由
常见的出现白屏的原因有哪些
- vue项目打包的路径问题
解决： vue.config.js中 publicPath: ''./"
- 路由重复或者没有配置路由
（1）由于把路由模式mode设置成history了，默认是hash
解决：将模式改为hash模式，或者直接把模式配置删除，而且history需要后端配合
（2）做动态路由时，next（）放行与next(...to, replace)区别造成的白屏，实质是路由重复
（3）第一次正常访问，刷新后白屏，vuex没有与本地存储结合，刷新后导致数据丢失
- 项目中使用了es6的语法，一些浏览器不支持es6
（该问题也可以说ie对promise的支持不太好）
解决：安装Babel ，Babel 会把这些新语法转译成较低版本的代码。
或者是配置对promise的支持信息 main.js import 'babel-polyfill' import Es6Promise from 'es6-promise' Es6Promise.polyfill() webpack.base.conf.js module.exports = { entry: { app: ["babel-polyfill", "./src/main.js"] } };
npm install --save-dev @babel/core @babel/cli @babel/preset-env
- vue首屏白屏问题加载js文件过大，通过打包优化，加快首屏页面打开速度
解决： 可以通过Gzip, CND，路由懒加载等方式
- ios9.3手机上项目空白，原因来自mac上的safari浏览器显示第三方插件 vuex-persist
解决：需要配置vue.config.js文件
module.exports = { transpileDependencies: ['vuex-persist'] }
标签：vue,
babel,
汇总,
js,
白屏,
vuex,
路由
From： https://www.cnblogs.com/zmztya/p/16591714.html