不兼容是因爲對es6不支持
一、關於babel-polyfill
1、說明:This will emulate a full ES2015+ environment and is intended to be used in an application rather than a library/tool. This polyfill is automatically loaded when using babel-node.(模擬ES2015以上的環境,主要用於對ES6不支持的新語法不支持的瀏覽器);
2、安裝:npm install --save babel-polyfill;
3、配置:module.exports = { entry: ["babel-polyfill", "./src/main.js"] };
4、main.js中配置:import 'babel-polyfill'
//放在最頂部,確保全面加載。
二、關於es6-promise
1、說明:若在項目中使用了ES6 promise對象,它在Chrome、Safari瀏覽器下可以正常運行,但在360兼容模式、IE內核中不支持;
2、安裝:npm install es6-promise;
3、配置:在main.js中加入require('es6-promise').polyfill()
,用於在node或瀏覽器中支持ES6 與CommonJS。
三、步驟詳細圖
1、index引入這句話或者這三句話
2、執行npm install --save babel-polyfill;
執行完上面語句package.json裏面就有了這個依賴(檢查2部是否執行完成的一個結果)
3、最上面引入,確保加載進去。
4、修改entery裏面的內容改成下圖那樣
注意:打包完後就能在ie瀏覽器看到了,但是在本地運行是不可以顯示的,具體原因我也不知道具體是怎麼回事兒,如果有知道的寶寶,歡迎指教
問題如圖:
其他瀏覽器都好,只有ie和360的兼容模式下是空白的
並且還報錯