nuxt-generate 靜態站

nuxt generate部署靜態站

在nuxt.config.js配置頁面路徑

 generate: {
   // 動態路由不可識別，所以這邊需要寫
   // 可預測的可以直接寫
    routes: [
      '/zh',
      '/en',
      '/zh/service/a',
      '/en/service/a',
      '/zh/service/b',
      '/en/service/b',
    ]
   // 不可預測的動態路由則通過axios搭配promise或者回掉函式配置
  // 可看官網https://zh.nuxtjs.org/api/configuration-generate
  }

預設情況下，執行nuxt generate將為每個路由建立一個目錄並生成index.html檔案。

image.png

在nuxt.config.js裡generate選項裡配置
subFolders： flase
設定為false時，將根據路由路徑生成HTML檔案

image.png

部署後專案會生成dist目錄，直接開啟對應的html檔案 ，可能會出現圖片不顯示，不用管 部署到伺服器後就不會有這個問題。