chore: update example

Author: pi0

docs/components/content/HomeHero.vue

@@ -77,7 +77,7 @@
             </nuxt-link>
 
             <a
-              href="https://githubbox.com/nuxt/image/tree/main/example"
+              href="https://githubbox.com/nuxt/image/tree/v1/example"
               target="_blank"
               rel="noopener"
               class="

example/.gitignore

@@ -1,5 +1,8 @@
-.nuxt
-dist
 node_modules
 *.log*
+.nuxt
+.nitro
+.cache
 .output
+.env
+dist

example/pages/index.vue example/app.vueexample/pages/index.vue renamed to example/app.vue

@@ -1,7 +1,7 @@
 <template>
-  <main>
-    <!-- https://image.nuxtjs.org/components/nuxt-picture -->
-    <!-- https://image.nuxtjs.org/components/nuxt-img -->
+  <NuxtLayout>
+    <!-- https://v1.image.nuxtjs.org/components/nuxt-picture -->
+    <!-- https://v1.image.nuxtjs.org/components/nuxt-img -->
     <figure>
       <nuxt-picture
         src="/images/mountains.jpg"
@@ -13,7 +13,7 @@
         Photo by <a href="https://unsplash.com/@kydroon" target="_blank" class="underline">Kurt Cotoaga</a> on <a href="https://unsplash.com/s/photos/mountain" target="_blank" class="underline">Unsplash</a>
       </figcaption>
     </figure>
-  </main>
+  </NuxtLayout>
 </template>
 
 <script>

example/layouts/default.vue

@@ -14,7 +14,7 @@
           Feel free to check out the full <a href="https://image.nuxtjs.org" target="_blank" class="text-green-500 hover:underline">documentation</a> to see everything you can do.<br>
         </p>
         <div class="block my-4 border-b" />
-        <nuxt />
+        <slot />
         <div class="block my-4 border-b" />
         <p class="mt-3 text-gray-600">
           You can edit the props or the <a href="https://image.nuxtjs.org/components/nuxt-picture" target="_blank" class="text-green-500 hover:underline">&lt;nuxt-picture&gt;</a> component in sandbox to see what you can do. Have fun!

example/nuxt.config.js

@@ -1,20 +1,14 @@
 export default {
-  components: true,
   head: {
-    title: 'Nuxt Image Example',
-    htmlAttrs: {
-      lang: 'en'
-    },
-    meta: [
-      { charset: 'utf-8' },
-      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
-      { hid: 'description', name: 'description', content: '' }
-    ]
+    title: 'Nuxt Image Example'
   },
   modules: [
-    '@nuxt/image'
+    '@nuxt/image-edge'
   ],
   image: {
-    domains: ['https://images.unsplash.com', 'https://source.unsplash.com']
+    domains: [
+      'https://images.unsplash.com',
+      'https://source.unsplash.com'
+    ]
   }
 }

example/package.json

@@ -1,13 +1,13 @@
 {
   "private": true,
   "scripts": {
-    "dev": "nuxt",
     "build": "nuxt build",
+    "dev": "nuxt dev",
     "generate": "nuxt generate",
-    "start": "nuxt start"
+    "preview": "nuxt preview"
   },
   "devDependencies": {
-    "@nuxt/image": "^0.7.1",
-    "nuxt": "^2.15.8"
+    "@nuxt/image-edge": "1.0.0-testing",
+    "nuxt": "^3.0.0-rc.4"
   }
 }

example/static/images/mountains.jpg example/public/images/mountains.jpgexample/static/images/mountains.jpg renamed to example/public/images/mountains.jpg

@@ -0,0 +1,3 @@
+{
+  "extends": "./.nuxt/tsconfig.json"
+}