溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶(hù)服務(wù)條款》

vue框架開(kāi)發(fā)出現(xiàn)頁(yè)面白屏怎么辦

發(fā)布時(shí)間:2021-09-26 10:26:02 來(lái)源:億速云 閱讀:781 作者:小新 欄目:開(kāi)發(fā)技術(shù)

小編給大家分享一下vue框架開(kāi)發(fā)出現(xiàn)頁(yè)面白屏怎么辦,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!

  網(wǎng)頁(yè)白屏有什么情況

  1.npmrunbuild打包頁(yè)面空白

  我們會(huì)發(fā)現(xiàn)頁(yè)面head中引用的js和css文件是出現(xiàn)了路徑錯(cuò)誤,這里修改如下:

  解決位置:config/index.js文件:把a(bǔ)ssetsPublicPath:'/'改為assetsPublicPath:'./'

  build:{

  assetsPublicPath:'./',

  }

  2.iOS的Safari下無(wú)法打開(kāi)網(wǎng)頁(yè)

  webpack-dev-server>=2.8.0的版本在iOSSafari下無(wú)法打開(kāi)網(wǎng)頁(yè),效果為白屏。

  控制臺(tái)報(bào)錯(cuò):Can'tfindvariable:SockJS應(yīng)該是Safari的BUG,比如下面的代碼就會(huì)拋出

  Erroreval("consta=function(){};functionb(){a();};b();")

  網(wǎng)頁(yè)白屏解決方法

  1.使用老版本:

  2.其它方法

  yarnaddbabel-plugin-transform-es2015-block-scoping-D

  修改webpack相關(guān)配置

  {

  test:/\.js$/,

  loader:'babel-loader',

  include:[

  ...,

  /node_modules\/webpack-dev-server/

  ]

  }

  3.升級(jí)vue2+部分手機(jī)訪(fǎng)問(wèn)出現(xiàn)頁(yè)面空白

  npmrundev后可能出現(xiàn)無(wú)法加載到路由模板的信息。

  解決位置:config/index.js文件:把devtool:'#eval-source-map'改為devtool:'inline-source-map'

  dev:{

  devtool:'inline-source-map',

  }

  4.升級(jí)vue2+IP訪(fǎng)問(wèn)頁(yè)面空白

  默認(rèn)只能通過(guò)localhost或者127.0.0.1才能訪(fǎng)問(wèn),如果使用本機(jī)的Ip地址會(huì)出現(xiàn)無(wú)法訪(fǎng)問(wèn)到的情況。

  解決位置:config/index.js文件:把config/index.js中“host”配置為“0.0.0.0”就可以解決,或者設(shè)置為你電腦的IP地址也行:

  dev:{

  host:'192.168.10.122',

以上是“vue框架開(kāi)發(fā)出現(xiàn)頁(yè)面白屏怎么辦”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對(duì)大家有所幫助,如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注億速云行業(yè)資訊頻道!

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

vue
AI