在做的項目是使用 vue-cli 腳手架為基礎的，只能使用微信瀏覽器打開的。在某次更新功能代碼后，被反饋在一些手機上會出現白屏。經過一番探索，多管齊下解決了問題

白屏可能的原因：

es6 代碼沒有被編譯成 es5 ；

文件打包路徑錯誤；

運營商塞入的廣告 js 服務器報錯，連累項目不能下載資源；

---

針對 1 和 2 ，分別采取以下做法：

解決位置：config/index.js 文件：把 assetsPublicPath: '/' 改為assetsPublicPath: './'

build: {assetsPublicPath: './', }

解決位置：

首先安裝 babel-polyfill 庫；

npm install --save babel-polyfill

然后修改 build/webpack.base.conf.js 文件，將

entry: {app: './src/main.js',}

改成

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

使得其從入口文件就開始轉換代碼。

---

做了上面的操作后，問題就解決了，因此沒有對 3 進行實踐。

---

3 的情況，是以前的經驗之談。部分用戶出現了打不開頁面的情況，剛好同事的手機也遇到同樣的情況，拿來分析之后發現，是運營商劫持了流量，往里面塞了廣告 js ，結果它的服務器還出錯.....解決方案是上 https ，完美解決。

原文地址：https://segmentfault.com/a/1190000016853748

更多專業前端知識，請上 【猿2048】www.mk2048.com

總結

以上是生活随笔為你收集整理的vue 项目白屏解决方案的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。