我用vue開發的一個小項目，項目開發出雛形，想打包一下放測試，但是我想放測試前自己檢查一下經過npm run build打包生成的項目，在本地服務器能不能正常跑，於是，經過網上大哥的幫忙，寫了個簡易的koa服務器，將打包好的dist文件，放到了服務器上。
說一下我的dist文件的結構，dist/index.html dist/static 然后static目錄下有打包好的js css img 文件，里面包含打包好的文件
再說一下koa服務器，服務器入口文app.js 監聽的3000 端口， 用localhost:3000 就可以訪問到
然后vue.config.js目前沒有做任何配置 publicpath的默認值就為“/”
然后我再localhost：3000端口訪問 結果頁面白屏！！！ network里資源狀態碼都是200 控制台有報錯 如下：
Uncaught SyntaxError: Unexpected token <
蒙圈了有沒有！！！ 這是什么錯。。。 經過我在網上的查找，估計是引用靜態資源路徑問題（因為網上很多，說白屏是靜態資源路徑引起的，然后報的相同的錯）
網上也說到過很多，部署時需要配置vue.config.js里面的baseurl的值，但是我用的vue3.70版本 目前最新。官方讓舍棄baseurl的配置，用publicpath來代替，於是，我hack了很多中配置方法，都不行。必須的知道哪里路徑錯了才行，好，現在來看看，空白頁network里靜態資源的引用路徑，如下：
http://localhost:3000/static/css/app.9977a20f.css
發現問題了謬？？？？！！！！
http://localhost:3000是我服務器的根 是相對於koa里app.js的路徑 而和app.js同級的是dist文件夾，這里存放着index.html 和statick文件夾
按正常邏輯，這個域要訪問到html頁面 有兩種辦法 一是將dist這一層去掉，用上述路徑可以訪問到index.html和statick文件 二是：
http://localhost:3000/dist/statick/css/app.css 才能正常訪問到，於是，我先試了第一種，把dist里的文件都拿了出來，放在了與app.js同級的目錄下，然后頁面正常顯示了。
但是我覺的這不是最好的解決辦法，我應該在vue中配置，將靜態資源的訪問路徑前加上一個dist 也就是變成第二種訪問路徑，那么vue.config.js的publicpath該上場了
配置如下：
//基本路徑(相對於服務器根目錄 靜態資源的相對路徑)
publicPath: process.env.NODE_ENV === "production" ? "/haha/" : "/",
然后打包構建，放到服務器，好了，頁面出來了！！！！明白了嗎？？？
再來看看現在的引用app.css的路徑
http://localhost:3000/haha/static2/css/app.9977a20f.css
這樣就對了嘛。。
這也更好理解了publicpath的作用
另外想說一些不是太相關的知識（關於路徑的）
. :一個點 表示一個級別的目錄 ./ 表示當前目錄下的目錄 ../ 表示上級目錄 ../../ 表示上級目錄的上級目錄 這對配置路徑比較有幫助
另外 / 與 ./ 的區別
/ :表示跟目錄 是絕對路徑
./ :是相對路徑 是相對於index.html的路徑
具體看下邊
/ 網站根路徑 ./ 當前路徑 ../ 上一級路徑 ../../ 上兩級路徑 例如：本地靜態網站 index頁面地址 127.0.0.1/bootstrap_test/index.html在這里頁面里面引入css和js路徑應該怎么寫呢? 1、 <link href="css/bootstrap.min.css" rel="stylesheet"> 實際請求地址為：127.0.0.1/bootstrap_test/css/bootstrap.min.css 找的是:和index.html 同級目錄下的css文件里面的 2、 <link href="./css/bootstrap.min.css" rel="stylesheet"> 實際請求地址為：127.0.0.1/bootstrap_test/css/bootstrap.min.css 找得是：和index.html 同級里面的css文件里面的 3、 <link href="/css/bootstrap.min.css" rel="stylesheet"> 實際請求地址為：127.0.0.1/css/bootstrap.min.css 找的是根目錄下面的css 4、 <link href="../bootstrap_test/css/bootstrap.min.css" rel="stylesheet"> 實際請求地址為：127.0.0.1/bootstrap_test/css/bootstrap.min.css 找得是：index.html上一級也就是和bootstrap_test處於同級里面的css文件里面的