1.如圖,在app.vue中添加了一個按鈕控件
2.執行 npm run build之后生成dist文件夾
3.運行后發現主頁一片空白,什么都沒有
4.打開開發者工具進行抓包,發現三個文件變紅,證明文件找不到
5.打開變紅的文件鏈接,確實提示文件不存在,因為實際文件應該在項目根目錄下的dist文件夾下。然而他默認在根目錄下尋找文件,所以找不到
文件不存在:
加上dist路徑,發現能找到文件
6.在項目根目錄下新建vue.config.js文件,並寫入代碼,然后重新執行npm run build 文件就能找到了
module.exports = { publicPath: '/dist/' }
7.更好的解決方案是把/dist/換成"./",意味着打包時候在相對路徑下尋找文件,效果是一樣的。