capacitor3+vue 在android低版本 白屏問題

capacitor3使用es2017+, 需要用babel翻譯才行。
主要是使用了async,然后默認(rèn)情況下vue使用的 babel-loader 會忽略所有 node_modules 中的文件, 所以只需要在 vue.config.js里加上一條配置即可。

module.exports = {
  transpileDependencies: ['@capacitor'],  
};

vue cli配置: https://cli.vuejs.org/zh/config/#transpiledependencies
capacitor3升級指南: https://capacitorjs.com/docs/updating/3-0#es2017

注意,我沒有使用ionic框架! 要使用ionic的話,就得把ionic的所有依賴也加到 transpileDependencies 里。
如果你的android機子的webview版本過低(應(yīng)該是chrome 54版本以下, 可以用 navigator.userAgent 查看) 的話,那么就千萬別用ionic了,因為54版本之前使用了過時(已被廢除)的api 注冊element document.registerElement(),不支持新api customElements.define來注冊element, 而ionic都是用customElements.define去注冊html element元素的, 這個問題好像用balbel都解決不了。

Document.registerElement API: https://developer.mozilla.org/zh-CN/docs/Web/API/Document/registerElement

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容