fix(examples): add sub-folder to github examples path (#3996)

examples/advanced/config-extends/pages/index.vue

@@ -5,7 +5,7 @@ const bar = getBar()
 </script>
 
 <template>
-  <NuxtExampleLayout example="config-extends">
+  <NuxtExampleLayout example="advanced/config-extends">
     theme runtimeConfig
     <pre>{{ JSON.stringify(themeConfig, null, 2) }}</pre>
     <BaseButton>Base Button</BaseButton>

examples/advanced/module-extend-pages/layouts/default.vue

@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout example="module-extend-pages">
+  <NuxtExampleLayout example="advanced/module-extend-pages">
     <slot />
   </NuxtExampleLayout>
 </template>

examples/app/error-handling/app.vue

@@ -15,7 +15,7 @@ function triggerError () {
 </script>
 
 <template>
-  <NuxtExampleLayout example="errors">
+  <NuxtExampleLayout example="app/error-handling">
     <template #nav>
       <nav class="flex align-center gap-4 p-4">
         <NuxtLink to="/" class="n-link-base">

examples/app/plugins/app.vue

@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout example="plugins">
+  <NuxtExampleLayout example="app/plugins">
     <div>{{ $myPlugin() }}</div>
   </NuxtExampleLayout>
 </template>

examples/auto-imports/components/app.vue

@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout example="components">
+  <NuxtExampleLayout example="auto-imports/components">
     <h1 class="text-xl opacity-50">
       Auto Imported Components
     </h1>

examples/auto-imports/composables/app.vue

@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout example="composables">
+  <NuxtExampleLayout example="auto-imports/composables">
     <p>Named export <code>useA</code> : {{ a }}</p>
     <p>Named export <code>useB</code> : {{ b }}</p>
     <p>Named export <code>useC</code> : {{ c }}</p>

examples/composables/use-async-data/app.vue

@@ -13,7 +13,7 @@ const refreshAll = async () => {
 </script>
 
 <template>
-  <NuxtExampleLayout example="use-async-data">
+  <NuxtExampleLayout example="composables/use-async-data">
     <div>
       <div class="flex justify-center gap-2">
         <NButton @click="showMountain = !showMountain">

examples/composables/use-cookie/app.vue

@@ -15,7 +15,7 @@ const logout = () => {
 </script>
 
 <template>
-  <NuxtExampleLayout class="h-50" example="use-cookie">
+  <NuxtExampleLayout class="h-50" example="composables/use-cookie">
     <template v-if="user">
       <h1 class="text-3xl mb-3">
         Welcome, {{ user.name }}! 👋

examples/composables/use-fetch/app.vue

@@ -4,7 +4,7 @@ const { data } = await useFetch(() => `/api/hello/${count.value}`, { params: { t
 </script>
 
 <template>
-  <NuxtExampleLayout example="use-fetch">
+  <NuxtExampleLayout example="composables/use-fetch">
     <div>
       Fetch result:
       <pre class="text-left"><code>{{ data }}</code></pre>

examples/composables/use-meta/app.vue

@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout example="use-meta">
+  <NuxtExampleLayout example="composables/use-meta">
     <div
       class="bg-gray-400/10 border-2 border-dashed border-gray-400/50 rounded-xl py-8 px-2 op-80"
     >

examples/composables/use-state/app.vue

@@ -3,7 +3,7 @@ const counter = useState('counter', () => Math.round(Math.random() * 1000))
 </script>
 
 <template>
-  <NuxtExampleLayout example="use-state">
+  <NuxtExampleLayout example="composables/use-state">
     <div>Counter: {{ counter }}</div>
     <div>
       <NButton class="font-mono" @click="counter++">

examples/experimental/reactivity-transform/app.vue

@@ -10,7 +10,7 @@ function dec () {
 </script>
 
 <template>
-  <NuxtExampleLayout example="reactivity-transform">
+  <NuxtExampleLayout example="experimental/reactivity-transform">
     <div>
       <Label :count="count" />
       <div class="flex gap-1 justify-center">

examples/experimental/wasm/app.vue

@@ -8,7 +8,7 @@ const { data } = await useAsyncData('sum',
 </script>
 
 <template>
-  <NuxtExampleLayout example="wasm">
+  <NuxtExampleLayout example="experimental/wasm">
     <p>
       <code>a = 100</code>
     </p>

examples/other/locale/app.vue

@@ -6,7 +6,7 @@ const date = useLocaleDate(new Date('2016-10-26') /* NUXT_BIRTHDAY */)
 </script>
 
 <template>
-  <NuxtExampleLayout example="locale">
+  <NuxtExampleLayout example="other/locale">
     <h1 class="text-xl opacity-50">
       Nuxt birthday
     </h1>

examples/routing/layouts/pages/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout example="layouts">
+  <NuxtExampleLayout example="routing/layouts">
     <template #nav>
       <nav class="flex align-center gap-4 p-4">
         <NuxtLink to="/default">

examples/routing/middleware/app.vue

@@ -3,7 +3,7 @@ const route = useRoute()
 </script>
 
 <template>
-  <NuxtExampleLayout example="middleware">
+  <NuxtExampleLayout example="routing/middleware">
     <NuxtPage />
 
     <template #nav>

examples/routing/nuxt-link/app.vue

@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout example="nuxt-link" class="example">
+  <NuxtExampleLayout example="routing/nuxt-link" class="example">
     <NuxtPage />
   </NuxtExampleLayout>
 </template>

examples/routing/pages/app.vue

@@ -3,7 +3,7 @@ const route = useRoute()
 </script>
 
 <template>
-  <NuxtExampleLayout example="pages">
+  <NuxtExampleLayout example="routing/pages">
     <NuxtPage />
 
     <template #nav>

examples/routing/universal-router/app.vue

@@ -4,7 +4,7 @@ const timer = useState('timer', () => 0)
 </script>
 
 <template>
-  <NuxtExampleLayout example="universal-router">
+  <NuxtExampleLayout example="routing/universal-router">
     A page...
     <br>