Vue + Vite 專案部署到 Nginx pinia 模組錯誤

問題說明

當你將 Vue + Vite 專案部署到 Nginx，並在瀏覽器開啟網站時，可能會遇到以下錯誤：

Uncaught TypeError: Failed to resolve module specifier "pinia". 
Relative references must start with either "/", "./", or "../".

這是因為你部署的是原始碼，而不是Vite 打包後的 dist/ 資料夾。

---

解決方案：部署 dist 打包資料夾

以下是完整部署步驟：

---

設定 Nginx 指向 dist/資料夾

請確認你的 Nginx 設定如下所示，將 root 設定為打包後的 dist/ 路徑：

server {
    listen 80;
    server_name yourdomain.com;

    root /var/www/your-project/dist;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }
}

• 請將 /var/www/your-project/dist 改成你的實際路徑。

• try_files 的設定能夠正確處理 Vue 的前端路由（SPA 模式）。

設定完成後，重新啟動 Nginx：

sudo systemctl restart nginx

---

最終確認

部署完成後，瀏覽器應該能正常載入所有模組（例如 pinia），不會再出現錯誤訊息。