我在webpack 5/Vuejs 3應用中使用webpack-dev-server，以利用在應用開發程序中一旦在編輯器中保存了代碼更改就會在瀏覽器中顯示的功能（我對該功能的解釋很長，但我認為它屬于 "熱 "或 "HMR"）。
好處是，這在原則上是可行的。我可以在我的編輯器中更新一個 .vue 檔案，保存它，看到 webpack-dev-server 重新編譯，看到 JS 控制臺日志顯示它檢測到了一個更改，并且該更改（例如一個文本更改）顯示在瀏覽器頁面上。
然而，當人們在初始（硬）頁面加載后導航到另一個路由（URL），從而使初始頁面的URL與當前的URL不同時，代碼的變化不會反映在瀏覽器頁面中。所有其他的步驟，如編譯、客戶端的變化檢測、重新加載變化、日志都被執行，但它只是沒有更新瀏覽器頁面。然而，當人們導航到其他地方并回傳時，它確實更新了頁面。
這個問題有人覺得很熟悉嗎？我想，即使在單頁應用程式中導航到另一條路線（URL），實時更新也應該是有效的（如果我的期望是錯誤的，請糾正）。
我的webpack.conf.js的相關部分（沒有什么特別的IMHO）：
devServer: {
historyApiFallback: {
rewrites: [{
from: /.*/,
to: path.posix.join（配置。 dev.assetsPublicPath, 'index.html'/span>)
}]
},
hot: true,
host: HOST || config.dev.host。
port: port || config.dev.port。
open: config.dev.autoOpenBrowser。
proxy: config.dev.proxyTable.
Update
有趣的是，對<style>部分的更新會立即反映出來，即使最初的頁面加載URL已經改變。
uj5u.com熱心網友回復：
只要寫下historyApiFallback: true。它應該能起作用。
devServer: {
historyApiFallback: true,
port: port || config.dev.port。
hot: true。
open: config.dev.autoOpenBrowser,
proxy: config.dev.proxyTable。
},轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/332739.html
標籤：