Nuxt3 中文课程 《实战全栈开发简书》.

直观的
Vue 框架

Nuxt是一个 开源框架 ,使得Web开发变得直观且强大。
可以自信地创建高性能和生产级别的全栈Web应用和网站。

Tips:本站由中文社区翻译与维护,与 nuxt.com 并无直接关系,最新内容请以官网为准。

最优秀的前端团队都信赖我们

强大的
Vue 组件

我们和你一样,热爱 Vue 单文件组件。简单,直观,强大,Nuxt 设计让你用最有意义的方式编写 Vue 组件。每个重复任务都会自动化,从而让你能专心编写全栈 Vue 应用程序。

app.vue
<script setup>
useSeoMeta({
  title: 'Meet Nuxt',
  description: 'The Intuitive Vue Framework.'
})
</script>

<template>
  <div id="app">
    <AppHeader />
    <NuxtPage />
    <AppFooter />
  </div>
</template>

<style>
#app {
  background-color: #020420;
  color: #00DC82;
}
</style>

静态或动态,
选择权在你

根据路由级别决定你需要的渲染策略。通过利用混合渲染,你可以兼得静态站点的性能和动态站点的交互性。

export default defineNuxtConfig({
  routeRules: {
    // Homepage pre-rendered at build time
    '/': { prerender: true },
    // Product page generated on-demand, revalidates in background
    '/products/**': { swr: true },
    // Blog post generated on-demand once until next deploy
    '/blog/**': { isr: true },
    // Admin dashboard renders only on client-side
    '/admin/**': { ssr: false },
    // Add cors headers on API routes
    '/api/**': { cors: true },
    // Redirects legacy urls
    '/old-page': { redirect: '/new-page' }
  }
})

结合
你所需的一切.

路由 & 布局

基于文件的路由系统,可以使用强大且约定优先的方法构建复杂的视图和界面。

数据获取

可以在服务器上运行的可组合函数,为你的组件获取数据并能够以各种方式呈现内容。

资源 & 样式

内建对图片、字体和脚本的优化支持,并支持CSS模块、Sass、PostCSS、CSS-in-JS等。

SEO & Meta标签

生产就绪和可由搜索引擎索引,同时给最终用户带来应用的感觉。

中间件

在渲染页面或一组页面之前运行自定义代码,如身份验证、本地化或A/B测试。

状态管理

Nuxt提供了一种简单的方式在组件间共享反应式且对SSR友好的状态。

过渡

通过对Vue和浏览器过渡的内建支持,创建布局、页面和组件之间的流畅过渡。

错误处理

内建错误处理和日志记录助力你调试应用并提供更好的用户体验。

Layers

通过另一个Nuxt应用扩展你的Nuxt应用,以复用组件、可组合函数、布局、页面等。

服务器路由

创建API端点和服务器路由,以安全地连接第三方服务并在前端使用。

自动导入

Nuxt 自动导入助手、可组合函数和 Vue API,让你在应用中使用这些功能,无需显式导入。

TypeScript

Nuxt提供了有用的快捷方式,保证你在编写代码时能获得精准的类型信息。

使用
endless更快发布

整合你最喜爱的工具和服务。Nuxt 建设来自灵活的,并且可以通过强大的模块生态系统进行扩展。只需一行代码就可以将你的应用连接到流行的无头 CMS、电子商务、数据库或 UI/UX 库。

CloudflareVercelHerokuAmplifyDigitalOceanNetlifyTailwind CSSSupabaseStripeFirebaseStrapiWordPressDirectusStoryblokSanitySentryShopifySnipcartMeilisearchAlgolia


全球的开发者共同构建

Nuxt及其生态系统的开发由一个国际团队领导。从贡献者到开发者倡导者,这个社区由具有不同视野和技能的成员组成。我们很高兴每天看到新的成员,鼓励任何人加入我们,以多种方式提供帮助:回答问题,做一个演讲,创建模块,贡献核心代码。

受到
全球互联网的信任

Nuxt提供了一个引人入胜的解决方案和一个帮助你发布高性能且对搜索引擎友好的全栈Vue应用程序的强大生态系统。选择服务端渲染和静态站点生成的灵活性是锦上添花。
尤雨溪

尤雨溪

Vue.js和Vite的创造者

对于构建生产级产品的团队来说,Nuxt是一个极好的选择。它旨在在保持优秀的Vue.js DX的同时,将最佳的性能实践融入其中。
Addy Osmani

Addy Osmani

Chrome的首席工程师

Nuxt对开发者和框架作者来说都是一种难以置信的创新和灵感来源。看到它在web项目中的增长真是太棒了。
Guillermo Rauch

Guillermo Rauch

Vercel的联合创始人和首席执行官

Nuxt直接提供出色的开发者生产力,体验和性能!它对细节的精细关注,确保团队可以暸解产品中的所有要素来高效地构建各种应用程序。
Sarah Drasner

Sarah Drasner

Director of Engineering, Google

Nuxt有一种独特的方法,将出色的开发者体验和可重用、完全集成的功能相结合,加速了你的下一个网站或应用程序的开发和性能。
Dominik Angerer

Dominik Angerer

Storyblok的联合创始人

当我第一次使用Nuxt的时候我就爱上了它。除了它的可扩展性,性能和开发者体验,背后的团队也非常出色。感谢你们开发了这样一个伟大的框架,使我们的生活变得更加简单!
Savas Vedova

Savas Vedova

GitLab的高级前端工程师

Nuxt的高性能和专注于开发者体验的融合是一场游戏的改变。它的服务端渲染和静态站点生成的灵活性,再加上和Vue.js生态系统一样旺盛的社区,使它成为现代web项目的首选。
Rijk van Zanten

Rijk van Zanten

Directus的首席技术官