精华内容
下载资源
问答
  • 主要介绍了详解vue 兼容IE报错解决方案,详细的介绍了几种原因及其解决方案,非常具有实用价值,需要的朋友可以参考下
  • Vue项目兼容IE11

    千次阅读 2021-01-22 17:00:02
    使用的是vue-typescript-admin-template项目(vue-cli3脚手架搭建)进行改造的,但在IE11下面出现各种语法错误,下面将解决方法记录下来,供大家参考。 下面是错误截图: 语法错误: Promise 错误 polyfill ...

    使用的是vue-typescript-admin-template项目(vue-cli3脚手架搭建)进行改造的,但在IE11下面出现各种语法错误,下面将解决方法记录下来,供大家参考。

    下面是错误截图:

    语法错误:

    Promise 错误

    polyfill

    默认的Vue CLI项目会使用@vue/babel-preset-app,它通过@bable/preset-env和browserslist配置来决定项目需要的polyfill。

    默认情况下,它会把useBuiltIns: 'usage' 传递给@bable/preset-env,这样它会根据源代码中出现的语言特性自动检测需要的 polyfill。这确保了最终包里 polyfill 数量的最小化。然而,这也意味着如果其中一个依赖需要特殊的 polyfill,默认情况下 Babel 无法将其检测出来。

    直接照Vue CLi浏览器兼容性中上解决方法:

    第一步:在babel的相关配置文件(babel.config.js、.babelrc 或package.json 的babel字段任意一个)中, 增加

    "useBuiltIns": "entry"

    注:babel7版本以后,会有差异 (https://babeljs.io/docs/en/babel-polyfill/)

    下面我们配置.babelrc文件:

    {
        "presets": [
          [
            "@babel/preset-env",
            {
              "useBuiltIns": "entry"
            }
          ]
        ]
      }

    第二步: 安装'@babel/polyfill',并在入口文件main.js中引入

    npm install --save @babel/polyfill

    引入的话官网推荐使用:

    import "core-js/stable";
    import "regenerator-runtime/runtime";

    最后重新启动项目,应该可以解决IE11问题。

    如果还是不行可以在vue.config.js中配置transpileDependencies,默认情况下babel-loader 会忽略所有 node_modules 中的文件。如果你想要通过 Babel 显式转译一个依赖,可以在 transpileDependencies 选项中列出来。

    如果项目中使用了CSS var(), IE11是不兼容的,我们可以使用css-vars-ponyfill

    npm install --save css-vars-ponyfill

    在main.js中引入即可:

    import cssVars from 'css-vars-ponyfill'
    cssVars({})

     

    参考资料:

    https://cli.vuejs.org/zh/guide/browser-compatibility.html#usebuiltins-usage

    https://zhuanlan.zhihu.com/p/103907934

     

    展开全文
  • vue cli3 兼容ie浏览器

    2021-06-21 10:47:19
    import Es6Promise from ‘es6-promise’ Es6Promise.polyfill() .babelrc文件内配置 { “presets”: [ [ “@vue/app”, { “useBuiltIns”: “entry”, “polyfills”: [ “es6.promise”, “es6.symbol” ] } ...

    安装依赖
    cnpm install --save babel-polyfill

    cnpm install es6-promise --save

    在main.js导入
    import ‘@babel/polyfill’;
    import Es6Promise from ‘es6-promise’
    Es6Promise.polyfill()

    .babelrc文件内配置
    {
      “presets”: [
       [
        “@vue/app”,
        {
         “useBuiltIns”: “entry”,
         “polyfills”: [
          “es6.promise”,
          “es6.symbol”
         ]
        }
       ]
      ]
    }

    babel.config.js文件中配置
    module.exports = {
      presets: [
       [
         “@vue/app”,
         {
           “useBuiltIns”: “entry”,
           polyfills: [
             ‘es6.promise’,
             ‘es6.symbol’
           ]
         }
       ]
     ],
    };

    vue.config.js文件中配置
    chainWebpack: config => {
        config.module
          .rule(‘iview’)
          .test(/iview.src.*?jsKaTeX parse error: Can't use function '\.' in math mode at position 211: …        test: /\̲.̲js|.html$|.\css/, // 匹配文件名
              threshold: 10240, // 对超过10k的数据压缩
              deleteOriginalAssets: false // 不删除源文件
            }))
        }
        config.resolve.alias
          .set(’@’, resolve(‘src’)) // key,value自行定义,比如.set(’@@’, resolve(‘src/components’))
          .set(’_c’, resolve(‘src/components’))
          .set(’@plugins’, resolve(‘src/plugin’))
      },

    展开全文
  • 主要介绍了Vue兼容ie9的问题全面解决方案,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • vue3.0 兼容ie浏览器

    2021-06-10 15:19:37
    vue3.0 兼容ie浏览器 安装babel/polyfill npm install --save @babel/polyfill 在main.js里面引入 (一定要在最上面,第一行) import '@babel/polyfill' 安装完成后会有babel.config.js文件,需手动定义...

    vue3.0 兼容ie浏览器

    1. 安装babel/polyfill
      	npm install --save @babel/polyfill
      
    2. 在main.js里面引入
      	(一定要在最上面,第一行)
      	import '@babel/polyfill'
      
    3. 安装完成后会有babel.config.js文件,需手动定义
         module.exports = {
         	  presets: [
         	    // '@vue/cli-plugin-babel/preset',
         	    ['@vue/app', {
         	      useBuiltIns: 'entry',
         	  }]
         	  ]
         	}
      
    4. 在package.json文件browserslist配置
      	"browserslist": [
      	    "> 1%",
      	    "last 2 versions",
      	    "not ie <= 11"
      	  ]
      
    5. 使用了vuex的在vue.config.js中,转es5
         module.exports = {
         	transpileDependencies:[/node_modules[/\\\\](element-ui|vuex|)[/\\\\]/]
         }
      
    end  大功告成
    
    展开全文
  • Vue CLI3 bable兼容ie11ie10

    2021-05-26 11:14:39
    Vue CLI3 bable兼容ie11ie10 Vue CLI3兼容IE11打开空白报错SCRIPT1003: 缺少 ‘:‘ 1、安装依赖 cnpm i @babel/polyfill -S 2、入口文件 main.js 引入依赖 import '@babel/polyfill'; 3.修改 babel.config.js ...

    Vue CLI3 bable兼容ie11ie10

    Vue CLI3不兼容IE11打开空白报错SCRIPT1003: 缺少 ‘:‘
    1、安装依赖

    cnpm i @babel/polyfill -S
    

    2、入口文件 main.js 引入依赖

    import '@babel/polyfill';
    

    3.修改 babel.config.js

    module.exports = {
      presets: [
        [
          '@vue/app',
          {
            useBuiltIns: 'entry'
          }
        ]
      ],
    };
    

    会报错exports is not defined
    修改 babel.config.js

    module.exports = {
    	
    	presets: [
    	  ['@vue/app', { useBuiltIns: 'entry', "modules": false }],
    	],
    }
    

    4.修改 vue.config.js
    默认情况下 babel-loader 会忽略所有 node_modules 中的文件。如果你想要通过 Babel 显式转译一个依赖,可以在这个选项中列出来。

    依赖较多,索性将所有的依赖都加上,不过会增加打包后的体积会增大,也可Babel 转换的单独引入

    module.exports = {
      transpileDependencies: process.env.NODE_ENV === "development" ? ["*"] : [],
    }
    

    5.package.json

    "browserslist": [
        "> 1%",
        "last 2 versions"
      ]
    
    展开全文
  • vue-cli3.0兼容IE浏览器

    2021-02-26 13:43:03
    因为项目中一些功能用到了IE的ocx组件部分,必须在IE环境下运行,按正常vue支持来说,IE8+应该是支持的,可能ES6写法需要进行兼容,我的项目就是在IE中无法打开,空白,也报一些 未定义什么的错误。 为了解决这个...
  • vue3.0兼容IE浏览器

    千次阅读 2020-07-16 15:13:19
    vue.config.js中的module.exports = {中加入 transpileDependencies: [//解决IE浏览器得es6转换成es5得问题(IE报错缺少':') /[/\\]node_modules[/\\]dom7[/\\]/, /[/\\]node_modules[/\\]swiper[/\\]/, /[/\\...
  • 先根据这篇文章修改 详解Vue-cli3 项目在安卓低版本系统和IE上白屏问题解决 如果没有其他问题是可以了的,下面是我代码中出现的其他问题导致页面无法显示或者报错 sockjs报错 控制台会一直报这个错,sockjs-node 是...
  • vue-cli3项目兼容ie

    万次阅读 2019-05-21 17:47:50
    1、当我们使用 vue-cli3 搭建的脚手架开发项目时,一般浏览器都可以支持,唯独ie浏览器,运行时页面一片空白 2、下载 babel-polyfill 模块 npm install babel-polyfill -s 3、 配置 polyfill,在根目录下新增babel...
  • Vuecli3项目兼容ie方案

    千次阅读 2020-05-12 14:33:34
    Vuecli3项目兼容ie方案 1.安装以下npm包: npm install --save babel-polyfill npm install es6-promise --save 2,在main.js中引用: import 'babel-polyfill' import Es6Promise from 'es6-promise' Es6Promise....
  • VueCli3.* 项目兼容IE11

    千次阅读 2020-01-11 03:08:09
    该项目是以,Vue-cli3.* 创建的工程,运行项目 IE11访问出现空白页面,现象如下 HTML1300: 进行了导航。 login HTML1300: 进行了导航。 login DOM7011: 此页上的代码禁用了反向和正向缓存。有关详细信息,请参阅: ...
  • vuecli4或者3兼容IE11

    2021-08-05 17:48:44
    vuecli4或者3兼容IE11,请教一下,怎么配置
  • VueCli3 兼容IE11 配置艰苦历程

    千次阅读 2020-08-01 10:34:20
    由于目前项目是采用VueCli3 搭建的项目,对google,火狐、eage 、360等浏览器兼容不错,但是对IE确出现了问题,目前项目要上线,那个着急啊,花了将近两天的时间从网上那个度娘,必应啊,但还好最终还是完美解决了。...
  • 1下载 babel-polyfill 模块 ...import Vue from 'vue' import App from './App.vue' import router from './router' import store from './store' import Button from 'ant-design-vue/lib/button'; im
  • 主要介绍了详解webpack3编译兼容IE8的正确姿势,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • vue-cli 兼容ievue项目兼容ie9.ie11

    千次阅读 2019-01-04 20:52:17
    1、首先 npm install --save babel-polyfill 2、然后在main.js中的最前面引入babel-polyfill import 'babel-polyfill' 3、在index.html 加入以下代码(非必须) ...IE=edge,chrome=1"&gt; ...
  • 一、兼容IE主要是从以下几个方面考虑 es6语法兼容 Number对象es6新方法兼容 requestAnimationFrame方法兼容 axios Promise兼容 axios cors兼容 Vue 官方对于 ie 浏览器版本兼容情况的描述是 ie9+,即是 ie9 及更...
  • vue3.0项目不兼容ie浏览器问题

    千次阅读 2020-12-14 15:25:16
    本人也是菜逼一枚,目前问题还未得到解决,有大佬有解决方法可以给我指点一下谢谢,目前了解到就是ie不兼容proxy,如果要兼容ie得放弃vue3的proxy,我想了想v3放弃proxy还用v3的意义何在,所以当场放弃了ie浏览器 ...
  • vue 兼容ie(兼容模式)的问题

    千次阅读 2019-07-08 17:12:45
    安装 babel-polyfill (cnpm install babel-polyfill --save-dev) babel-polyfill (cnpm install babel-polyfill --save-dev) 在入口文件buiild中引入 import “babel-polyfill” 或者 require(“babel-polyfill...
  • vue项目兼容IE11

    千次阅读 2018-01-17 17:05:16
    1、npm安装babel-polyfill npm install babel-polyfill --save-dev 2、在入口文件main.js...3、如果也是用了官方脚手架vue-cli,还需要在webpack.config.js配置文件中做修改,即可。 entry: { app: ["babel-
  • 主要介绍了vue+iview 兼容IE11浏览器的实现方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • Vue CLI 3 配置兼容IE10

    千次阅读 2019-09-23 19:01:16
    最近做了一个基于Vue的项目,需要兼容IE浏览器,目前实现了打包后可以在IE10以上运行,但是还不支持在运行时兼容IE10及以上。 安装依赖 yarn add --dev@babel/polyfill 在入口文件main.js引入依赖 import'@babel...
  • Vue-cli3.0兼容IE11的方法

    千次阅读 2020-01-07 16:48:40
    Vue3.0兼容IE方法 因为项目需要,必须在IE11上跑现在已经写好的项目。目前的状况是在Chrome上可以顺利的跑起来,在IE就会出现白屏的情况,也会出现下列错误。 会出现各种各样奇怪的语法错误,我猜测是ES6语法IE不...
  • vue项目兼容IE浏览器

    万次阅读 热门讨论 2018-08-17 11:04:56
    vue项目兼容IE浏览器 利用vue写出的项目打包后在IE浏览器下显示空白,是因为缺少babel-polyfill的缘故。 解决方法: 1、安装babel-polyfill包; 2、在main.js文件中引入babel-polyfill; 3、在...
  • 主要介绍了详解Vue Cli浏览器兼容性实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
  • 引入 babel-polyfill (可使用cnpm) npm install --save babel-polyfill 在 main.js里引入 import “babel-polyfill” ...在build下 webpack.base.conf.js 文件里,修改 ...在 webpack.config.js 中,将 babel-...
  • Vue 3 不再支持 IE 11!

    2021-04-06 20:51:41
    4 月 3 日,Vue 作者尤雨溪宣布:Vue 3 将不会支持 IE11。 总结 放弃Vue 3IE11支持计划。 重点关注Vue 2.7的backport兼容特性。 尤神表示: 在漫长的开发过程中,也对IE11的兼容性进行了研究和实验,但由于...
  • vue上传(兼容IE9)

    千次阅读 2018-02-02 17:13:20
    项目中vue文件上传功能原来使用的是element ui组件,头像上传裁剪使用的是vue-image-crop-upload,但是这两个组件只支持到IE10+,现在项目要求兼容IE9,这两个组件就没办法实现。 我基于Web Uploader封装了vue上传...
  • vue elementui 兼容ie11

    2021-08-02 16:25:51
    Chrome无论线上还是本地都是正常的,但IE11打开之后就是空白,本地也是空白,遂先解决了本地空白问题。 1.安装npm install --save babel...3.vue.config.js加入 transpileDependencies: process.env.NODE_ENV === ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 16,162
精华内容 6,464
关键字:

vue3兼容ie

vue 订阅