利用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)過診斷，配置錯(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)過反復(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è)參考，也希望大家多多支持錯(cuò)新站長站。