最近試了vue項目在IE上運行的效果乡括,結果打開空白屏,經過處理又遇到各種問題智厌,在這里記錄一下問題和解決方案诲泌,又遇到其它適配問題的朋友也希望可以留言一下問題和解決方案供大家參考,謝謝铣鹏。
首先是最基本的問題:IE不支持ES6語法敷扫,這個就是一上來白屏的問題,看控制臺提示語法錯誤吝沫,解決方案:
1呻澜、安裝babel-polyfill:npm i babel-polyfill -save。
2惨险、main.js中引入:import 'babel-polyfill'羹幸。
3、如果還有報語法錯誤就點擊看一下是哪個庫中的js報錯然后在vue.config.js中單獨添加辫愉,例如加入是echarts中的js文件報錯就添加:transpileDependencies: ['echarts'] 栅受。
上面處理完后一般就可以正常運行了,下面記錄一些其他適配問題,也希望大家?guī)兔ρa充:
1屏镊、正則表達式帶來的報錯
如果某個界面中使用了正則表達式中包含了 ‘?<=’ 就會報 ‘[Object error] {description: "錯誤的數量詞"} ...’ 類似這樣的錯誤(IE不支持后行斷言)依疼,想辦法用其他方法實現需要的功能。
2而芥、word-break:break-all律罢;不生效
在IE上word-break和word-wrap都需要html元素為塊級元素才能生效,所以如果是用了span就不生效棍丐,用div可以生效误辑。
3、flex布局子視圖換行問題
父元素設置了display:flex歌逢,且是縱向布局巾钉,里面子視圖寬度默認是100%的,給子視圖內容設置了換行秘案,在其他瀏覽器沒問題砰苍,在IE里面沒有換行寬度超出了父視圖的寬,給子視圖設置width:100%即可阱高。
(持續(xù)更新...)