這篇文章給大家介紹vue 項(xiàng)目中出現(xiàn)白屏如何解決，內(nèi)容非常詳細(xì)，感興趣的小伙伴們可以參考借鑒，希望對(duì)大家能有所幫助。

堅(jiān)守“ 做人真誠 · 做事靠譜 · 口碑至上 · 高效敬業(yè) ”的價(jià)值觀，專業(yè)網(wǎng)站建設(shè)服務(wù)10余年為成都成都地磅秤小微創(chuàng)業(yè)公司專業(yè)提供企業(yè)網(wǎng)站建設(shè)營銷網(wǎng)站建設(shè)商城網(wǎng)站建設(shè)手機(jī)網(wǎng)站建設(shè)小程序網(wǎng)站建設(shè)網(wǎng)站改版，從內(nèi)容策劃、視覺設(shè)計(jì)、底層架構(gòu)、網(wǎng)頁布局、功能開發(fā)迭代于一體的高端網(wǎng)站建設(shè)服務(wù)。

白屏可能的原因：

1. es6 代碼沒有被編譯成 es5 ；

2. 文件打包路徑錯(cuò)誤；

3. 運(yùn)營商塞入的廣告 js 服務(wù)器報(bào)錯(cuò)，連累項(xiàng)目不能下載資源；

針對(duì) 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']

使得其從入口文件就開始轉(zhuǎn)換代碼。

做了上面的操作后，問題就解決了，因此沒有對(duì) 3 進(jìn)行實(shí)踐。

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

關(guān)于vue 項(xiàng)目中出現(xiàn)白屏如何解決就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到。