?

webpack-dev-server啟動項目時訪問localhost:8080會出現 ~ / 這種情況：

?

解決方法：

在webpack配置文件中devServer配置：publicPath: '/'

devServer: {publicPath: "/",contentBase: "./dist", // 服務啟動在哪一個文件夾下open: true, // 啟動服務時，自動打開瀏覽器port: 8080, // 端口號// proxy 跨域時模擬接口代理hot: true, // devServer開啟Hot Module Replacement的功能hotOnly: true // 即便HMP的功能沒有生效，瀏覽器也不能自動刷新 },

?

官網解釋：devServer.publicPath

https://www.webpackjs.com/configuration/dev-server/

devServer.publicPath ? string此路徑下的打包文件可在瀏覽器中訪問。假設服務器運行在 http://localhost:8080 并且 output.filename 被設置為 bundle.js。默認 publicPath 是 "/"，所以你的包(bundle)可以通過 http://localhost:8080/bundle.js 訪問。可以修改 publicPath，將 bundle 放在一個目錄：publicPath: "/assets/" 你的包現在可以通過 http://localhost:8080/assets/bundle.js 訪問。確保 publicPath 總是以斜杠(/)開頭和結尾。 也可以使用一個完整的 URL。這是模塊熱替換所必需的。publicPath: "http://localhost:8080/assets/" bundle 可以通過 http://localhost:8080/assets/bundle.js 訪問。devServer.publicPath 和 output.publicPath 一樣被推薦。

?

?

總結

以上是生活随笔為你收集整理的listing directory /的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。