使用create-react-app構建的項目(並引入react-app-polyfill做IE兼容)在開發環境下的IE瀏覽器中報錯的解決方案


個人所負責的一個項目,需要兼容IE11,所以已經按照react-app-polyfill官方指定的方案進行兼容配置
即在項目src/index.js中:

// The first lines in src/index.js
import 'react-app-polyfill/ie11';
import 'react-app-polyfill/stable';
// other codes

並在package.json 中的 "browserslist"字段加入了對IE11的支持。

上述配置在yarn build(生產環境)之后是沒有問題的,但開發環境下IE11依舊報錯。

* 有一種處理方案是public/index.html中的<head>里引入一些必要的兼容性js文件,如es6-sham、es-shim等,防止一些代碼先於src/index.js執行。

但這種方案在本人的項目中還是遇到了問題,開發環境下IE11依然無法訪問。

 

最后,我所使用的解決方案(感謝提出該方案的同學)是這種:

1. 在項目中的 node_modules 文件夾下找到 react-dev-utils 包;

2. 找到此包的 webpackHotDevClient.js 這個文件中第60行;

3. 按照下圖,添加一個 slashes 參數 (true)

4. yarn start后,如果此時在IE11中訪問依然看到的空白頁面,但控制台無報錯,刷新下頁面應該就可以了

以上總結的兩種比較好的處理方案,希望對大家有幫助!


免責聲明!

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



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