關(guān)于Webpack dev server熱加載失敗的解決方法
更新時(shí)間：2018年02月22日 16:25:20 作者：蟻方陣
下面小編就為大家分享一篇關(guān)于Webpack dev server熱加載失敗的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
利用Webpack dev server作為熱加載服務(wù)器時(shí)，出現(xiàn)以下錯(cuò)誤：
XMLHttpRequest cannot load http://localhost:8080/dist/06854fc8988da94501a9.hot-update.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.
或者出現(xiàn)以下的警告信息：
dev-server.js:37 [HMR] Update failed: Error: Manifest request to http://localhost:8080/dist/06854fc8988da94501a9.hot-update.json timed out. at XMLHttpRequest.request.onreadystatechange (http://localhost:8080/dist/main.js:38:22)
經(jīng)過(guò)診斷，配置錯(cuò)誤的地方在于webpack.config.js的publicPath，需要將絕對(duì)地址改為相對(duì)地址，如下：
output : {
filename : '[name].js',
// 不可配置為絕對(duì)路徑,這是錯(cuò)誤的配置
//publicPath: "http://localhost:8080/dist/",
// 這是正確的配置，
publicPath: "/dist/",
path : build,
// umd包含了對(duì)amd、commonjs、var等多種規(guī)范的支持
libraryTarget : 'var'
}
經(jīng)過(guò)反復(fù)的測(cè)試，將webpack dev server的publicPath注入到其他域下，如果使用絕對(duì)地址配置，一定會(huì)出現(xiàn)上述錯(cuò)誤。
需要特別注意的是，webpack dev server與webpack-hot-middleware剛好相反，webpack-hot-middleware必須使用絕對(duì)地址。
以上這篇關(guān)于Webpack dev server熱加載失敗的解決方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript中this的學(xué)習(xí)筆記及用法整理
在本篇文章里小編給大家整理的是關(guān)于JavaScript中this的使用以及代碼實(shí)例，需要的朋友們學(xué)習(xí)下。2020-02-02
javascript 閉包函數(shù)做顯隱內(nèi)容
用閉包函數(shù)做顯隱內(nèi)容,主要優(yōu)勢(shì)就是可以增加顯示與隱藏效率。2009-03-03
整理Javascript函數(shù)學(xué)習(xí)筆記
整理Javascript函數(shù)學(xué)習(xí)筆記，之前一系列的文章是跟我學(xué)習(xí)Javascript，本文就是進(jìn)一步學(xué)習(xí)Javascript函數(shù)，希望大家繼續(xù)關(guān)注2015-12-12
js CSS3實(shí)現(xiàn)卡牌旋轉(zhuǎn)切換效果
這篇文章主要為大家詳細(xì)介紹了js CSS3實(shí)現(xiàn)卡牌旋轉(zhuǎn)切換效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-07-07
幻宇的層模擬窗口效果－提供演示和下載...2007-01-01
微信小程序 多行文本顯示...+顯示更多按鈕和收起更多按鈕功能
這篇文章主要介紹了微信小程序多行文本顯示...+顯示更多按鈕和收起更多按鈕,代碼簡(jiǎn)單易懂，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2019-09-09
JS中Select下拉列表類(lèi)(支持輸入模糊查詢(xún))功能
這篇文章主要介紹了JS中Select下拉列表類(lèi)(支持輸入模糊查詢(xún))功能，代碼簡(jiǎn)單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧2017-01-01
JavaScript閉包函數(shù)訪問(wèn)外部變量的方法
這篇文章主要介紹了JavaScript閉包函數(shù)訪問(wèn)外部變量的方法,本文使用匿名函數(shù)來(lái)實(shí)現(xiàn)在閉包中訪問(wèn)外部變量,需要的朋友可以參考下2014-08-08
HTML頁(yè)面登錄時(shí)的JS驗(yàn)證方法
這篇文章主要介紹了HTML界面登錄時(shí)的JS驗(yàn)證方法,需要的朋友可以參考下2014-05-05
關(guān)于javascript模塊加載技術(shù)的一些思考
這篇文章主要介紹了關(guān)于javascript模塊加載技術(shù)的一些思考 ,需要的朋友可以參考下2014-11-11