SSG 如何在 Nuxt 中工作？

Question

我是 Nuxt 開發平台的新手，主要在 Vue(v2) 中工作。

在深入研究文檔並在本地進行了一些實驗之后，我仍然需要澄清一些事情：

1. 在 static 生成模式下，每個頁面是否都有自己的 Vue 應用程序實例？ 也就是說，從服務器請求的每個預渲染頁面在客戶端都表現為 SPA。
2. 如果 #1 為真，那么每個頁面，並且實際上，每個應用程序都與所有其他頁面和應用程序隔離運行嗎？ 沒有共享 state？
3. 在 SSG 模式下使用 Vuex 時，在服務器上渲染頁面時，每個頁面是否都有自己的 Vuex 存儲，該存儲用初始 state 膨脹？ 而且，這個 state 會傳遞給客戶端嗎？
4. 這個商店在導航到不同的頁面（甚至刷新當前頁面）時被破壞，被一個新的替換對嗎？

Answer 1

1. 在 SSG 中，每個頁面都會提前呈現，但最后會被水合，因此成為 SPA。 Nuxt 基本上是 Vue 的類固醇，但它仍然是 Vue。
2. 不知道你在這里所說的隔離，你完全可以傳遞道具，使用發射等......同時，如果你確實有頁面，它們不會同時加載，有代碼拆分+延遲加載+預取。 一些信息可以在這里找到。
3. 將 Vuex 與 Nuxt 一起使用時，您可以開箱即用地使用命名空間模塊。 你確實有nuxtServerInit來預填充存儲是的。 順便說一句，您可以閱讀Nuxt 生命周期。 但是您沒有開箱即用的逐頁 Vuex 模塊，這個 IMO 沒有真正的用途。 是的，你當然會在客戶端上獲得你的 Vuex 商店。
4. 如果您使用<a></a>標簽導航到不同的路徑，您將核對您的 SPA 是的。 如果您使用<nuxt-link></nuxt-link> ，您將留在 SPA 中，因為 Vue 路由器將進行“導航”。 但是，是的，如果您直接在 url 中鍵入路徑並按Enter或使用F5刷新頁面，您的整個 SPA 將被刪除，所有內容都將從頭開始替換。

我在最新的 Nuxt-nation 發表過演講，質量並不好（對此感到抱歉），但你可能會從中得到一些有趣的東西。