最近我们的项目选择用vue来做开发,在这个过程IE兼容性


首先我们按照步骤来安装vue-cli 
创建项目运行

npm install
npm run dev

然后我们在ie9下打开发现没有用但是vue官网告诉我们他是兼容ie9的

官网地址:https://github.com/vuejs/vue

下图是错误提示ie9: 
 
然后就找资料查文档,总算给我找到了。 
要实现其实很简单,只需要我们下载一个babel-polyfill,

npm install babel-polyfill --save-dev

下载完成后我们怎么用它 
这时我们要找到build文件夹下webpack.base.conf.js在里面修改一下就行了

module.exports = {
entry: {
app: './src/main.js'
},

改成

module.exports = {
entry: {
'babel-polyfill': 'babel-polyfill',
app: './src/main.js'
},

就ok了 是不是很简单

第二问题就是axios的请求在ie下没有用 
这个怎么解决? 
也是就是下载一个js的问题 
下面就直接贴代码

npm install es6-promise --save-dev
/*main.js下*/
import promise from 'es6-promise'
promise.polyfill()

辛辛苦苦把项目写好了,然后再Chrome跑的天衣无缝。然后经理告诉我要兼容ie9及以上。信心满满的拿出来试了试。GG思密达!!!

一、Pormise的问题,原来是Axios不能直接兼容IE9

先去项目里下载es6-promise

npm install es6-promise

然后去页面导入

import promise from 'es6-promise';
promise.polyfill();
二、URLSearchParams未定义的问题,原来是IE9不支持URLSearchParams。(千万别用一些不被大众浏览器兼容的东西,都是坑)

先去项目里下载qs

npm install qs

然后去Axios放参数的时候这样放

import qsfrom 'qs';
var params = {
'param1':1,
'param2':2
}
qs.stringify(params)
三、GET方法在IE9会直接默认去拿缓存,返回的是304而不是正常拿到数据后的200.
这个就在GET方法的params中加个时间戳就行了。
time:new Date().getTime()

vue-cli 在IE下兼容设置的更多相关文章

  1. VUE cli 4.x下配置多页面以及同时配置支持element-ui及mint-ui并且优化首页文件大小。

    场景,公司的一个小型项目,需同时支持移动端和PC端.最开始考虑做两个独立的项目.但后来考虑到总共只有4个功能页面,布署起来相对麻烦.所以决定做在一个项目里. 1.升级vue-cli到4.x npm i ...

  2. vue cli 构建的 webpack 项目设置多页面

    1. webpack-dev-server下的设置(npm run dev) ./build/webpack.dev.conf.js 中,修改 new HtmlWebpackPlugin ,一个页面一 ...

  3. Vue CLI 3 配置兼容IE10

    最近做了一个基于Vue的项目,需要兼容IE浏览器,目前实现了打包后可以在IE10以上运行,但是还不支持在运行时兼容IE10及以上. 安装依赖 yarn add --dev @babel/polyfil ...

  4. vscode下搭建vue.js开发环境(基于最新的@Vue/cli 4.2.2)

    2020-02-13. 网上的那些怎么安装vue环境的2.x就不要再看了,都过时了,现在去官网下载,按照他们的设置各种问题.接下来看下最新的安装方法. 前四步是一样的: 1.下载并安装vscode 2 ...

  5. Vue Cli 3.x项目如何部署到IIS子站点下

    Vue Router在IIS下的部署参考:https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E5%90%8E%E7%AB% ...

  6. vue cli 3.x 设置4个空格缩进

    vue cli 3.x 设置4个空格缩进: 文件.editorconfig中,indent_size = 2修改为indent_size = 4 文件 .eslintrc.js 添加一行:'inden ...

  7. ubuntu下安装vue/cli提示No command 'vue' found

    通过官方指令 npm install -g @vue/cli 安装vue脚手架提示: No command 'vue' found, did you mean: Command 'vpe' from ...

  8. vue cli 3

    介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统 通过 @vue/cli 搭建交互式的项目脚手架. 通过 @vue/cli + @vue/cli-service-global 快 ...

  9. vue cli+axios踩坑记录+拦截器使用,代理跨域proxy(更新)

    16319 1.首先axios不支持vue.use()方式声明使用,看了所有近乎相同的axios文档都没有提到这一点建议方式 在main.js中如下声明使用 import axios from 'ax ...

随机推荐

  1. IDT系统中断描述表以及绕过Xurtr检测的HOOK姿势

    什么是中断?  指当出现需要时,CPU暂时停止当前程序的执行转而执行处理新情况的程序和执行过程.即在程序运行过程中,系统出现了一个必须由CPU立即处理的情况,此时,CPU暂时中止程序的执行转而处理这个 ...

  2. Log4j2又爆雷!2.16.0存在DOS风险,升级2.17.0可解决

    本以为,经过上周的2.16.0版本升级,Log4j2的漏洞修复工作,大家基本都要告一段落了. 万万没想到,就在周末,Log4j官方又发布了新版本:2.17.0 该版本主要修复安全漏洞:CVE-2021 ...

  3. LuoguP7041 [NWRRC2016]King's Heir 题解

    Content 给出现在的日期,请从 \(n\) 个人当中选出一个人,使得他是所有成年人(\(\geqslant 18\) 岁的人)中年龄最小的. 数据范围:设日期为 \(yy/mm/dd\),则有 ...

  4. Java 数据类型:集合接口Map:HashTable;HashMap;IdentityHashMap;LinkedHashMap;Properties类读取配置文件;SortedMap接口和TreeMap实现类:【线程安全的ConcurrentHashMap】

    Map集合java.util.Map Map用于保存具有映射关系的数据,因此Map集合里保存着两个值,一个是用于保存Map里的key,另外一组值用于保存Map里的value.key和value都可以是 ...

  5. java 常用类库:格式化NumberFormat;SimpleDataFormat类(转换Data()对象);DateTimeFormatter 转换LocalDateTime时间对象

    NumberFormat类 该类是一个做数字格式化的类,它是一个抽象类,无法实例化.它提供了parse()和format()方法,其中format用于将数值,格式转化成字符串,parse()用于把字符 ...

  6. 动态导入模块__import__("str") importlib标准库

    解释器内部使用的为__import__('str') #!/usr/bin/env python # Author:Zhangmingda print('我是aa类 ') #被import的时候就执行 ...

  7. IPtables 之“四表五链”

    目录 架构图 IP tables 简介 包过滤防火墙 Iptables如何过滤 "四表" "五链" Iptables流程 架构图 公司架构模式(酒店迎宾比喻) ...

  8. github访问慢处理办法

    Windows 系统:C:\Windows\System32\drivers\etc\hostsLinux 系统:/etc/hostsMac(苹果电脑)系统:/etc/hostsAndroid(安卓) ...

  9. IDEA版本2020.1全局MAVEN配置

    我们用IDEA打开项目有时候要每次配置maven地址,这样就很麻烦 我们可以直接设置全局的 这样所有新打开的项目都能使用

  10. 【剑指Offer】序列化二叉树 解题报告(Python)

    [剑指Offer]序列化二叉树 解题报告(Python) 标签(空格分隔): 剑指Offer 题目地址:https://www.nowcoder.com/ta/coding-interviews 题目 ...