渐进式
Web 框架

<script setup lang="ts">
const version = 4
</script>

<template>
  <h1>
    Hello Nuxt {{ version }}!
  </h1>
</template>

<style scoped>
h1 {
  font-size: 3rem;
}
</style>

<template>
  <h1>Index page</h1>
  <NuxtLink to="/blog/hello-world">
    Go to blog post
  </NuxtLink>
</template>

<script setup lang="ts">
const { data: page } = await useFetch('/api/cms/home')
</script>

<template>
  <h1>{{ page.title }}</h1>
  <NuxtLink to="/blog/hello-world">
    Go to blog post
  </NuxtLink>
</template>

<script setup>
const message = ref('Nuxt')
const hello = () => sayHello(message.value)
</script>

<template>
  <main>
    <h1>Demo with auto imports</h1>
    <form @submit.prevent="hello">
      <MyInput v-model="message" />
      <button type="submit">Say Hello</button>
    </form>
  </main>
</template>

export default defineEventHandler((event) => {
  return {
    message: 'Hello World'
  }
})