Nuxt 作为单页应用

如果你有任何原因阻止你将 Nuxt 用作服务器端渲染应用程序,那么 Nuxt 非常适合开发单页应用程序。正如我们在本章开头提到的,Nuxt 提供了两种开发应用程序的模式:通用模式和 spa 模式。这意味着你只需要在项目配置的 mode 属性中指定 spa,我们将在下一章中更详细地探讨这一点。

因此,你可能会想,如果我们可以使用 Nuxt 开发 SPA,那么为什么还要麻烦使用 Vue 呢?事实上,你从 Nuxt 开发的 SPA 与从 Vue 开发的 SPA 略有不同。你从 Vue 构建的 SPA 是传统的 SPA,而从 Nuxt 构建的 SPA 是一个 “静态” SPA(我们将其称为 Nuxt SPA)——你的应用程序页面在构建时预先渲染。这意味着部署 Nuxt SPA 在技术上与静态生成 Nuxt 通用 SSR 应用程序相同——两者都需要相同的 Nuxt 命令:nuxt generate

这可能会令人困惑,你可能会问静态生成的 SSR 应用程序和静态生成的 SPA 之间有什么区别?区别非常明显——与静态生成的 SSR 应用程序相比,静态生成的 SPA 没有页面内容。静态生成的 SPA 使用你的应用程序页面和 “空” HTML 预先渲染,就像传统的 SPA 一样——没有页面内容。这有点令人困惑,但请放心,我们将在本书接下来的章节中弄清楚这一切。特别是,你将了解在 Nuxt 中开发 SPA 的权衡以及如何克服这些权衡。

你将在第十五章 “使用 Nuxt 创建 SPA” 中学习如何开发 Nuxt SPA 并使用远程 API 生成静态 Nuxt SPA