vue中使用babel-polyfill解決低版本瀏覽器不兼容問題

vuex requires a Promise polyfill in this browser.

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

為了方便看帖子同學的使用，再重敲一遍命令行：npm install --save-dev 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項中

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

解決方案如下：

方案1：在 webpack.config.js 文件中，entry 入口處修改，加入即可

"babel-polyfill":"babel-polyfill",//用來解決的兼容性

例如：

entry: {
    "babel-polyfill":"babel-polyfill",//用來解決的兼容性
    app: path.resolve(__dirname, config.entry.module + "/app.js"),
    vendor: config.entry.vendor
},

方案2：不修改webpack的情況下，在你的主入口文件頭部加入，例如：app.js中加入即可

import 'babel-polyfill'

例如：

import 'babel-polyfill'

import Vue from 'vue';
Vue.config.debug = true;

方案3：也就是使用cdn的資源，以js的文件加入到html頁面：例如：

<script src="https://cdn.bootcss.com/babel-polyfill/6.23.0/polyfill.min.js"></script>

Vue2.0 之 自帶瀏覽器里無法打開（兼容處理） - 解決方案       https://blog.csdn.net/qq_16559905/article/details/70238583

 

第二種方式：vue 解決ie9的兼容問題

當vue遇見ie9的時候，部署到服務器之后，打開居然是一片空白，vue是支持ie9的，這個時候就需要來一波兼容了

1、首先npm install --save babel-polyfill

2、然后在main.js中的最前面引入babel-polyfill

      import 'babel-polyfill'

3、在index.html 加入以下代碼（非必須）

     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

4、在config中的webpack.base.conf.js中,修改編譯配置

entry:{
    app:['babel-polyfill','./src/main.js']      
}

本地文件：E:\www\svn\project\vue_manage_test

 

當然，如果你只用到了 axios 對 promise進行兼容，可以只用 es6-promise

 

npm install es6-promise --save

在 main.js 中的最前面 引入

import 'es6-promise/auto'

完成以上配置，ie9兼容就完成了

解決vue在ie9中的兼容問題     https://blog.csdn.net/landl_ww/article/details/79149461