欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

關于Webpack dev server熱加載失敗的解決方法

 更新時間：2018年02月22日 16:25:20   作者：蟻方陣  
下面小編就為大家分享一篇關于Webpack dev server熱加載失敗的解決方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

利用Webpack dev server作為熱加載服務器時，出現(xiàn)以下錯誤：

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)

經過診斷，配置錯誤的地方在于webpack.config.js的publicPath，需要將絕對地址改為相對地址，如下：

output : {
 filename : '[name].js',
 // 不可配置為絕對路徑,這是錯誤的配置
 //publicPath: "http://localhost:8080/dist/",

 // 這是正確的配置，
 publicPath: "/dist/",
 path : build,
 // umd包含了對amd、commonjs、var等多種規(guī)范的支持 
 libraryTarget : 'var' 
}

經過反復的測試，將webpack dev server的publicPath注入到其他域下，如果使用絕對地址配置，一定會出現(xiàn)上述錯誤。

需要特別注意的是，webpack dev server與webpack-hot-middleware剛好相反，webpack-hot-middleware必須使用絕對地址。

以上這篇關于Webpack dev server熱加載失敗的解決方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關文章

  • bootstrap選項卡擴展功能詳解

    bootstrap選項卡擴展功能詳解

    這篇文章主要為大家詳細介紹了bootstrap選項卡擴展功能，增加關閉，超出一行顯示下拉，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2017-06-06
  • JS實現(xiàn)改變HTML上文字顏色和內容的方法

    JS實現(xiàn)改變HTML上文字顏色和內容的方法

    這篇文章主要介紹了JS實現(xiàn)改變HTML上文字顏色和內容的方法,涉及JS數(shù)學運算與頁面元素動態(tài)操作相關技巧,需要的朋友可以參考下
    2016-12-12
  • JS、CSS以及img對DOMContentLoaded事件的影響

    JS、CSS以及img對DOMContentLoaded事件的影響

    最近在做性能有關的數(shù)據(jù)上報，發(fā)現(xiàn)了兩個非常有意思的東西：Chrome開發(fā)者工具的Timeline分析面板，以及DOMContentLoaded事件。一個是強大的令人發(fā)指的性能分析工具，一個是重要的性能指標，于是就用Timeline對DOMContentLoaded事件進行了一番研究
    2014-08-08
  • js實現(xiàn)簡潔的TAB滑動門效果代碼

    js實現(xiàn)簡潔的TAB滑動門效果代碼

    這篇文章主要介紹了js實現(xiàn)簡潔的TAB滑動門效果代碼,通過簡單的JavaScript自定義函數(shù)動態(tài)遍歷頁面元素實現(xiàn)tab滑動切換的功能,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-09-09
  • JavaScript深拷貝的一些踩坑記錄

    JavaScript深拷貝的一些踩坑記錄

    這篇文章主要給大家介紹了關于JavaScript深拷貝的一些踩坑記錄，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2021-03-03
  • 深度解析JavaScript中的filter()方法

    深度解析JavaScript中的filter()方法

    在JavaScript中,filter()是一個數(shù)組方法,用于從數(shù)組中過濾出符合特定條件的元素,并返回一個新數(shù)組,本文將帶大家深度解析JavaScript中的filter()方法,需要的朋友可以參考下
    2023-09-09
  • 小程序使用watch監(jiān)聽數(shù)據(jù)變化的方法詳解

    小程序使用watch監(jiān)聽數(shù)據(jù)變化的方法詳解

    這篇文章主要介紹了小程序使用watch監(jiān)聽數(shù)據(jù)變化的方法詳解,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
    2019-09-09
  • 深度剖析JavaScript作用域從局部到全局一網打盡

    深度剖析JavaScript作用域從局部到全局一網打盡

    這篇文章主要為大家介紹了JavaScript作用域的深度剖析，從局部到全局一網打盡，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪
    2023-05-05
  • js的壓縮及jquery壓縮探討(提高頁面加載性能/保護勞動成果)

    js的壓縮及jquery壓縮探討(提高頁面加載性能/保護勞動成果)

    搞定js的加密和壓縮，一方面可以提高頁面加載性能，另外一方面也希望辛苦研發(fā)出來的成果得到一定的保護,感興趣的朋友可以了解下，或許對你有所幫助
    2013-01-01
  • JavaScript中標識符提升問題

    JavaScript中標識符提升問題

    標識符指的是javascript中定義的符號，標識符可以由任意順序的大小寫字母、數(shù)字、下劃線和美元符號組成，但標識符不能以數(shù)字開頭，也不能是javascript中的保留關鍵字。并且要注意，javascript是嚴格區(qū)分大小寫的。
    2015-06-06

最新評論