Nuxt Server Components Example

Client Components

This is an example for Client Components only

Preview

Client Component

This component is not included in the bundle

If count is changed, code is changed.

const a = 0

Code

components

islands

pages

examples

<script setup lang="ts">
import CodeExample from '~/components/clients/CodeExample.vue';

definePageMeta({
  layout: 'example',
});

const count = ref(0);
</script>

<template>
  <Boundary label="Client Component">
    <button class="mt-2 rounded-md bg-gray-800 px-2 py-1" @click="count++">
      increment
    </button>
    <CodeExample :count class="mt-6" />
  </Boundary>
</template>