解决:Vue2项目兼容IE,页面出现白屏

2023-12-28 17:12:14

前提条件:Vue版本:2.6.10

网上说的方法大部分都是没什么作用,可能是因为版本不同的原因

安装需要的包

npm install --save @babel/polyfill
#注意重点!!,core-js版本必须和Vue的对应上,不然不兼容会报错
#这一步弄好基本没啥问题了
npm install --save core-js@2.6.1 
npm install --save regenerator-runtime

安装完可以先运行下项目,看下是否正常显示,如果报错,可能就是core-js版本不一致问题

安装完成开始配置

  • main.js里面引入
import '@babel/polyfill' *//(一定要在最上面,第一行)*
  • babel.config.js文件修改
module.exports = {
   	  presets: [
   	    // '@vue/cli-plugin-babel/preset',
   	    ['@vue/app', {
   	      useBuiltIns: 'entry',
   	  }]
   	  ]
   	}
  • package.json文件browserslist配置
"browserslist": [   
  "> 1%",  
  "last 2 versions",    
  "not ie <= 11"   ] 
  • vue.config.js配置
module.exports = {
 transpileDependencies:['*'] //最开始这里的值为 true!
  }

到这里就完成啦 ~~~
另外core-js版本安装没问题的话基本是都可以正常显示的

文章来源:https://blog.csdn.net/weixin_43474476/article/details/135264416
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。