把vue打包檔部署在特定路徑

因為客戶的網站有分成兩種類型,想要把網站部署在類似這種 domain.com/AAA, domain.com/BBB 的資料夾結構下,當初以為就把dist/整包給他放在他開好的資料夾就可以了,後來發現我大錯特錯,切換路由一直失敗,於是上網看了一下官網,發現只需要調整兩個步驟就可以了。

設定publicPath

module.exports = {
  publicPath: process.env.VUE_APP_BASE_URL,
};
VUE_APP_BASE_URL="/AAA"
VUE_APP_BASE_URL="/"

 

 

設定router

import Vue from "vue";
import VueRouter from "vue-router";
Vue.use(VueRouter);
const routes = [
//...
]
const router = new VueRouter({
  mode: "history",
  base: process.env.BASE_URL, // 加上這行
  routes
});

export default router;
module.exports = {
  publicPath: process.env.VUE_APP_BASE_URL,
  }
};

完成之後就可以打包,把dist/檔案放到正確的資料夾下面了。

學習程式原來可以這麼簡單:六角學院線上課程

初學者如何成為vue前端工程師:查看課程內容

---------------------------

| 軟體開發 | 網站建置 | 網頁系統 | 資料庫網站 |

| 客製化網站 (報名系統、投票系統、掛號系統...) |

| 前後端技術合作 |

歡迎與我們聯繫:jessica@penueling.com

加入Line立即聊聊:@539mjyid

0
0 回復

發表評論

Want to join the discussion?
Feel free to contribute!

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。