npm run build生成路徑問題


vue項目中可以使用npm run build 命令生成靜態文件夾dist,開發者可以直接點擊dist文件夾下面的index.html問價來訪問自己的項目,但是用vue-cli生成的項目,當運行npm run build 時,生成的index.html中的文件是絕對路徑

(問題一)
直接打開index.html之后就會報錯:

因為vue-cli的默認配置中, assetsPublicPath是用絕對目錄(文件路徑config/index.js),所以dist文件夾里的文件必須放在服務器的根目錄

解決辦法

 將assetsPublicPath的路徑選項改為'./';

這時直接點擊index.html文件就可以了。

(問題二)
默認情況下,npm run dev/test是開發環境,npm run build 是生產環境,在開發環境完成代碼和測試,之后用生產環境生成代碼。npm run build的時候, 一開始就會提示Built files are meant to be served over an HTTP server. Opening index.html over file:// won't work.

解決辦法

在npm run build 運行完之后,再運行

cd dist
npm install -g http-server // 該命令只需執行一次, 安裝過之后, 以后就不需要重復安裝了.
hs

這時直接輸入localhost:8080/ 192.168.2.108:8080/127.0.0.1:8080就可以訪問頁面了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM