介绍

Nuxt提供前端和后端功能，因此您可以专注于重要的事情:创建您的web应用程序。

Nuxt是什么?

为了理解什么是Nuxt，我们需要了解为了创建一个现代应用程序我们需要什么:

• JavaScript framework

  JavaScript框架带来了反应性和web组件，我们选择Vue.js。

• Webpack and Vite

  一个在开发中支持热模块替换和在生产中捆绑您的代码的捆绑器，我们同时支持webpack 5和Vite。

• Latest JavaScript syntax

  一个编译器可以在支持旧浏览器的同时编写最新的JavaScript语法，我们使用esbuild。

• Server side

  一个在开发中为你的应用服务的服务器，但也支持服务器端渲染或API路由，Nuxt使用h3部署的多功能性，如无服务器，工作者，Node.js和无与伦比的性能。

• Routing library

  处理客户端导航的路由库，我们选择 vue-router.

这只是冰山一角，想象一下必须为你的项目设置所有这些，让它工作，然后，随着时间的推移维护它。自2016年10月以来，我们一直在这样做，调优所有配置，为任何Vue应用程序提供最佳的优化和性能。

Nuxt处理了这一点，并提供了前端和后端功能，因此您可以专注于重要的事情:创建您的web应用程序。

视图引擎

Nuxt使用Vue.js作为视图引擎。所有Vue 3的功能都可以在Nuxt中使用。你可以在关键概念部分中阅读关于Vue与Nuxt集成的细节。

自动化和约定

Nuxt使用约定和明确的目录结构来自动化重复的任务，并允许开发人员专注于推送特性。配置文件仍然可以自定义和覆盖其默认行为。

• 自动导入 — 文件系统路由和API层
• 数据获取工具
• 零配置TypeScript支持
• 配置构建工具

更多信息请参见关键概念部分.

渲染模式

Nuxt提供了不同的渲染模式来适应不同的用例:

• 通用渲染(服务器端渲染和水化)
• 客户端渲染
• 完整的静态站点生成
• 混合渲染(每路由缓存策略)

阅读更多关于Nuxt渲染模式.

服务器引擎

Nuxt服务器引擎Nitro解锁新的全栈功能。

在开发中，它使用Rollup和Node.js工作者进行服务器代码和上下文隔离。它还通过读取server/API/中的文件和从server/middleware/中的服务器中间件生成服务器API。

在生产中，Nitro将你的应用和服务器构建为一个通用的.output目录。这个输出很轻:从任何Node.js模块(除了polyfills)中删除。你可以在任何支持JavaScript的系统上部署这个输出，从Node.js, less server, Workers, Edge-side渲染或纯静态。

阅读更多关于Nuxt服务器引擎.

生产就绪

Nuxt应用程序可以部署在Node或Deno服务器上，预呈现为托管在静态环境中，或者部署到无服务器和边缘提供程序。

更多信息请参见部署部分.

模块化

模块系统允许通过自定义特性和与第三方服务的集成来扩展Nuxt。

发现关于模块的更多信息。

架构

Nuxt由不同的 core packages组成:

• Core Engine: nuxt
• Bundlers: @nuxt/vite-builder and @nuxt/webpack-builder
• Command line interface: nuxi
• Server engine: nitro
• Development kit: @nuxt/kit
• Nuxt 2 Bridge: @nuxt/bridge

我们建议阅读每个概念，以全面了解Nuxt的功能和每个包的范围。