渐进式
Web 框架
使用 Nuxt 创建高质量的 Web 应用,这是一个开源框架,让基于 Vue.js 的全栈开发变得直观。(本站由中文社区翻译与维护,与 nuxt.com 并无直接关系,最新内容请以官网为准。)
app.vue
<script setup lang="ts">
const version = 3
</script>
<template>
<h1>
你好 Nuxt {{ version }}!
</h1>
</template>
<style scoped>
h1 {
font-size: 3rem;
}
</style>
pages/index.vue
<template>
<h1>首页</h1>
<NuxtLink to="/blog/hello-world">
前往博客文章
</NuxtLink>
</template>
pages/index.vue
<script setup lang="ts">
const { data: page } = await useFetch('/api/cms/home')
</script>
<template>
<h1>{{ page.title }}</h1>
<NuxtLink to="/blog/hello-world">
前往博客文章
</NuxtLink>
</template>
app.vue
<script setup>
const message = ref('Nuxt')
const hello = () => sayHello(message.value)
</script>
<template>
<main>
<h1>自动导入演示</h1>
<form @submit.prevent="hello">
<MyInput v-model="message" />
<button type="submit">说你好</button>
</form>
</main>
</template>
server/api/hello.ts
export default defineEventHandler((event) => {
return {
message: '你好,世界'
}
})
全球领先企业的选择
随需启用功能
Nuxt 随着你的需求成长和适应,同时提供卓越的开发者体验。从简单的登陆页面到支持数百名开发者的复杂 Web 应用,Nuxt 都能胜任。我们设计 Nuxt 以适应各种技能水平的开发者。
- 零配置立即使用 Vue 或 TypeScript 编码 —— Nuxt 为你处理所有设置。
- 渲染模式服务端渲染、客户端渲染、静态站点生成,你可以自由选择,甚至细化到页面级别。
- 路由与布局使用我们基于文件的路由系统构建复杂的 URL 视图,同时复用组件以提升性能。
- 数据获取让你的 Vue 组件支持异步并等待数据。Nuxt 提供强大的组合式函数用于通用的数据获取。
- 错误处理使用内置的错误处理程序和自定义错误页面捕获应用中的错误。
- 过渡动画在布局、页面和组件之间实现平滑的过渡动画。
- 资产与样式享受自动化的图片、字体和脚本优化,内置支持。
- SEO 与元标签创建完全可被搜索引擎索引的生产级应用。
- 模块化使用 200 多个模块扩展 Nuxt 功能,加速应用发布。
- 中间件在渲染页面前保护或添加自定义逻辑(本地化、A/B 测试)。
- TypeScript 类型安全使用自动生成类型和 tsconfig.json 编写类型安全的代码。
- 现在深入了解 Nuxt
建立在坚实的基础之上
Nuxt 基于可靠的开源技术构建,灵活选择不同的构建工具。
使用 Vue.js 构建前端
Nuxt 基于 Vue.js 构建,利用其响应式、组件化的架构创建强大、可扩展且无缝的 Web 应用。
使用 Vite 构建
Nuxt 利用 Vite 的前端构建能力,为 Web 应用的快速开发提供支持,带来即时 HMR,优化开发者体验。
使用 Nitro 构建服务端
Nuxt 使用 Nitro 作为服务端引擎,构建多功能的全栈 Web 应用,随时可部署到任何平台。
开发者构建简单而强大 Web 应用的首选
Nuxt 源于开发者提升生产力和平台性能的需求。
从最初作为自动化任务和服务器端渲染的 Vue 解决方案,到如今被全球初创公司和企业所信赖。
Nuxt Enterprise Support
为了确保你的 Nuxt 项目发挥最大潜力,我们的 Nuxt 专家团队,包括 Vue、:icon{name=i-custom-nuxt .align-middle} Nuxt 和 Vite 的核心贡献者,提供全套服务。
性能优化
通过我们的专家优化提升 Nuxt 的性能和可靠性。
迁移到 Nuxt
确保从开始到部署的无缝、顺畅迁移。
Nuxt 工作坊
通过培训和支持打造专家团队。
由全球开发者共同构建
Nuxt 及其生态系统的开发由一个国际团队领导。从贡献者到开发者倡导者,社区由不同背景和技能的成员组成。我们每天都乐于看到新成员加入,并鼓励任何人以多种方式加入我们并提供帮助:回答问题、发表演讲、创建模块以及为核心代码做出贡献。