vue-cli 在IE下兼容設置


最近我們的項目選擇用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()


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM