本文介紹了解決Vue2.0自帶瀏覽器里無法打開的原因（兼容處理），分享給大家，希望對大家有幫助

Vue 之 android內(nèi)嵌H5頁面不顯示出現(xiàn)這個問題，原因有很多

首先，別急，請看下面的推薦方案：

1、找個Android真機測試下（機型版本為4.4以上），真機聯(lián)調(diào)測試

Android

只需要四個步驟：

1、先保證 是否安裝了chrome瀏覽器

2、其次 ，保證 chrome 是否 已經(jīng)翻墻成功！

3、最后 使用Android 真機連接 電腦

4、最后的最后，打開chrome ,輸入：chrome://inspect

即可，另外，chrome只支持 android 4.4以上手機！

IOS

只需要兩步驟：

1、打開手機端web檢查器，設(shè)置 -> Safari -> 高級（最底部） -> Web 檢查器 打開

2、確保iOS系統(tǒng)手機接入 MAC 電腦（必須是Mac，window調(diào)試不了ios系統(tǒng)）

3、找到Mac電腦的 Safari瀏覽器，找到開發(fā)者，就會顯示的手機的設(shè)備

4、此時此刻就可以使用了，調(diào)試各個App上網(wǎng)頁版的頁面了。

注：如果是 Hybrid 嵌入式開發(fā)，線上版本，可能就不能調(diào)試了，因為IOS App 會把線上的調(diào)試功能給禁用，安全！

2、如果報 報錯 vuex requires a Promise polyfill in this browser.那么，就是兼容性不夠好，請看下面的解決方案：

首先,使用 node 安裝 *babel-polyfill 命令*

npm install --save-dev -polyfill

解決方案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>

PS：我沒試過

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

最新評論