vue IE 報錯 引用babel-polyfill


一、vue 項目報錯 vuex requires a Promise polyfill in this browser

     在網上找到下面三篇文章,然而和我的項目都不太一樣。 我的項目基於

  • 基礎模板: vue-admin-template 修改的。
  • 文檔:https://panjiachen.gitee.io/vue-element-admin-site/zh/guide/#功能      

  

  配置分為:基礎配置(base)、 開發環境配置(dev)和運行環境配置(prod)

  

       我的解決方案:

  1 由於現在在開發階段,只需要安裝到開發環境 

          npm install babel-polyfill  --save-dev

   如果想卸載可以:  npm  uninstall babel-polyfill  --save-dev

   

       2 在基礎配置文件webpack.base.conf.js,找到 

     

   然后替換為:app: ["babel-polyfill", "./src/main.js"],如下

    3 在終端運行:npm run dev

   

   圖片中npm run dev:s 是因為我在package.json 配置了dev:s 配置,這樣可以實現瀏覽器 本機 IP地址訪問。一般情況用不上。

 

 4 在IE 中運行,成功。

    因為說明文檔不詳細,加上我剛入門,花了半天時間才搞定。

 

 

其它相關文章:

https://blog.csdn.net/tc216/article/details/78213204?utm_source=copy

解決Vuex, IE瀏覽器報錯

 1安裝 babel-polyfill 。 babel-polyfill可以模擬ES6使用的環境,可以使用ES6的所有新方法

           npm install --save babel-polyfill

       2 修改Webpack/Browserify/Node配置

  在webpack.config.js文件中,使用

  module.exports = {

  entry: {

    app: ["babel-polyfill", "./src/main.js"]

    }

  };

 

https://blog.csdn.net/u010351326/article/details/80568171

VUE解決IE不能用的方法

一般來說VUE本身是不支持IE的,但是可以用特殊的方法來解決,親測可用
第一步:下載插件 cnpm install --save babel-polyfill
第二步:入口文件main.js引入( import 'babel-polyfill') 好多人沒引入,結果不生效
第三步:配置文件修改 vue-loader.conf(腳手架工具構建的項目修改這個配置文件,如果沒有就修改webpack.conf.js),如下增加entry
module.exports ={

    entry: ["babel-polyfill", "./app/js"]

}

 

https://www.cnblogs.com/princesong/p/6728250.html

babel-polyfill的引用和使用

前兩天一個首頁項目,想用vue玩耍一下,就用vue-cli搭建了一套vue的開發框架

完成開發、聯調和上線后,問題來了

chrome、ff瀏覽器下都能正常顯示的頁面,在百度瀏覽器下愣就顯示不出來了

我還以為是調用的uclogin組件包有問題呢,因為他會在url后面用?方式拼接一些formu、appid、u等參數,用於用戶登錄信息驗證成功后redirect到要去的頁面

找來之前用過uclogin和已經應用過uclogin的系統,都沒有出現過這個問題,那么這個鍋就不是uclogin來背了,那么該誰來背這個鍋呢

打開瀏覽器的debug工具窗口,看到有一個紅色的報錯警示:vuex requires a Promise polyfill in this browser.

問題已經找到了,那如何來解決呢,百度一下:“vuex requires a Promise polyfill in this browser.”

第一條搜索結果就是:

他說出了問題出現的原因,就是ie9和一些低版本的高級瀏覽器對es6新語法並不支持,也說出了解決辦法

為了方便看帖子同學的使用,再重敲一遍命令行:npm install --save-dev babel-polyfill

這個鍋vuex來背一半吧,另外一半讓百度瀏覽器來背吧,誰讓你內核版本太低不支持es6新語法的呢。哈哈 

然而送佛沒有送到西,只是說了要安裝babel-polyfill插件,如何使用可能對於一些剛鼓搗系統構建的同學還是有些懵逼的,這也是我寫此帖的目的,我來整理一下再補上這臨門一腳😄

babel-polyfill用正確的姿勢安裝之后,引用方式有三種:

1.require("babel-polyfill");

2.import "babel-polyfill";

3.module.exports {

  entry["babel-polyfill""./app/js"]

};

注:第三種方法適用於使用webpack構建的同學,加入到webpack配置文件(webpack.config.js)entry項中

重新執行構建命令,在低版本的瀏覽器中就可以正常打開頁面了。


免責聲明!

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



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