从 Vue 到 Nuxt
Nuxt 是一个更高级别的 Node.js Web 开发框架，用于创建可以以两种不同模式开发和部署的 Vue 应用程序：通用（SSR）或单页应用程序（SPA）。此外，你可以在 Nuxt 中将 SSR 和 SPA 部署为静态生成的应用程序。尽管你可以选择 SPA 模式，但 Nuxt 的全部强大功能在于其通用模式或服务器端渲染（SSR），用于构建通用应用程序。通用应用程序用于描述可以在客户端和服务器端执行的 JavaScript 代码。但是，如果你希望开发一个仅在客户端执行的经典（或标准/传统）SPA，你可能需要考虑使用纯粹的 Vue。
|
请注意， |
Nuxt 基于 Vue 构建，并增强了一些额外的功能，例如异步数据、中间件、布局、模块和插件，这些功能首先在服务器端执行你的应用程序，然后在客户端执行。这意味着该应用程序通常比传统的服务器端（或多页）应用程序渲染更快。
Nuxt 预装了以下软件包，因此你无需像在标准的 Vue 应用程序中那样安装它们：
-
Vue (https://vuejs.org/)
-
Vue Router (https://router.vuejs.org/)
-
Vuex (https://vuex.vuejs.org/)
-
Vue Server Renderer (https://ssr.vuejs.org/)
-
Vue Meta (https://vue-meta.nuxtjs.org/)
最重要的是，Nuxt 使用 webpack 和 Babel 来编译和打包你的代码，并包含以下 webpack 加载器：
-
Vue Loader (https://vue-loader.vuejs.org/)
-
Babel Loader (https://webpack.js.org/loaders/babel-loader/)
简而言之，webpack 是一个模块打包器，它将你的 JavaScript 应用程序中的所有脚本、样式、资源和图像打包在一起，而 Babel 是一个 JavaScript 编译器，它将下一代 JavaScript（ES2015+）编译或转译为浏览器兼容的 JavaScript（ES5），以便你可以在当前的浏览器上运行你的代码。
|
有关 |
webpack 使用他们所谓的加载器（loaders）在通过 JavaScript 的 import 语句或 require 方法导入文件时预处理这些文件。你可以编写自己的加载器，但在编译 Vue 文件中的代码时不必这样做，因为 Babel 社区和 Vue 团队已经为你创建好了这些加载器。在下一节中，我们将探索 Nuxt 附带的以及这些加载器贡献的强大功能。