diff --git a/.eslintrc b/.eslintrc
index 1f1318423f8..2e2b3cfa1a3 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -16,6 +16,7 @@
     "vue/multi-word-component-names": "off",
     "vue/one-component-per-file": "off",
     "vue/require-default-prop": "off",
+    "vue/no-multiple-template-root": "off",
     "jsdoc/require-jsdoc": "off",
     "jsdoc/require-param": "off",
     "jsdoc/require-returns": "off",
diff --git a/README.md b/README.md
index d703bee028e..37c9ac763f1 100644
--- a/README.md
+++ b/README.md
@@ -50,7 +50,7 @@ Welcome to Nuxt 3 repository ✨
 - Ensure you have the latest LTS version of Node.js installed
 - Install dependencies with `npx yarn install`
 - Run `npx yarn stub` to activate passive development
-- Open playground with `npx yarn play`
+- Open playground with `npx yarn dev`
 
 Learn more about in our documentation on [how to contribute to Nuxt](https://v3.nuxtjs.org/community/contribution).
 
diff --git a/docs/components/app/AppLayout.vue b/docs/components/app/AppLayout.vue
index 6d13cfc2ac0..18b862f46eb 100644
--- a/docs/components/app/AppLayout.vue
+++ b/docs/components/app/AppLayout.vue
@@ -2,7 +2,7 @@
   <div class="relative w-full">
     <AppHeader :links="headerLinks" />
 
-    <div class="lg:flex" :class="{ 'd-container': layout.aside }">
+    <div class="lg:flex" :class="containerClass">
       <slot v-if="['xs', 'sm', 'md'].includes($mq) || layout.aside" name="aside">
         <AppAside :links="headerLinks" :class="layout.asideClass" />
       </slot>
@@ -33,6 +33,11 @@ export default defineComponent({
   computed: {
     layout () {
       return this.$docus.layout.value
+    },
+    containerClass () {
+      if (this.layout.aside && this.layout.fluid) { return 'd-container-fluid' }
+      if (this.layout.aside) { return 'd-container' }
+      return ''
     }
   }
 })
diff --git a/docs/components/atoms/Sandbox.vue b/docs/components/atoms/Sandbox.vue
new file mode 100644
index 00000000000..4186b04149e
--- /dev/null
+++ b/docs/components/atoms/Sandbox.vue
@@ -0,0 +1,107 @@
+<template>
+  <div class="w-full min-h-[500px] mx-auto mb-6 overflow-hidden text-3xl rounded-md sandbox mt-4">
+    <TabsHeader
+      v-if="!src"
+      ref="tabs"
+      :active-tab-index="activeTabIndex"
+      :tabs="providersTabs"
+      @update="updateTab"
+    >
+      <div slot="footer" class="absolute top-1/2 transform -translate-y-1/2 right-0 px-2">
+        <Link class="flex items-center text-gray-500 dark:text-gray-400" :to="sandBoxUrl" blank>
+          <IconExternalLink class="h-5 w-5" />
+        </Link>
+      </div>
+    </TabsHeader>
+
+    <iframe
+      v-if="url"
+      :src="url"
+      title="Sandbox editor"
+      sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"
+      class="w-full h-full min-h-[700px] overflow-hidden bg-gray-100 dark:bg-gray-800"
+    />
+    <span v-else class="text-white flex-1">Loading Sandbox...</span>
+  </div>
+</template>
+
+<script>
+import {
+  defineComponent,
+  onMounted,
+  computed,
+  ref,
+  useContext
+} from '@nuxtjs/composition-api'
+export default defineComponent({
+  props: {
+    src: {
+      type: String
+    },
+    repo: {
+      type: String
+    },
+    branch: {
+      type: String
+    },
+    dir: {
+      type: String
+    },
+    file: {
+      type: String,
+      default: 'app.vue'
+    }
+  },
+  setup (props) {
+    const { $colorMode } = useContext()
+    const providers = {
+      CodeSandBox: () =>
+        `https://codesandbox.io/embed/github/${props.repo}/tree/${props.branch}/${props.dir}?hidenavigation=1&theme=${$colorMode.value}`,
+      StackBlitz: () =>
+        `https://stackblitz.com/github/${props.repo}/tree/${props.branch}/${props.dir}?embed=1&file=${props.file}&theme=${$colorMode.value}`
+    }
+    const providersTabs = Object.keys(providers).map(p => ({ label: p }))
+    const activeTabIndex = ref(-1)
+    const tabs = ref()
+    const url = ref('')
+    const provider = ref('')
+    function updateTab (i) {
+      activeTabIndex.value = i
+      changeProvider(providersTabs[i].label)
+    }
+    onMounted(() => {
+      // TODO: if Safari, use CodeSandBox by default: const defaultSandbox = ...
+      provider.value =
+        window.localStorage.getItem('docus_sandbox') || 'CodeSandBox'
+      url.value = props.src || providers[provider.value]()
+      // Set active tab
+      activeTabIndex.value = Object.keys(providers).indexOf(provider.value)
+      setTimeout(() => tabs.value.updateTabs(activeTabIndex.value), 100)
+    })
+    const changeProvider = (value) => {
+      provider.value = value
+      url.value = props.src || providers[provider.value]()
+      localStorage.setItem('docus_sandbox', value)
+    }
+    const sandBoxUrl = computed(() => url.value?.replace('?embed=1&', '?').replace('/embed/', '/s/'))
+    return {
+      tabs,
+      provider,
+      url,
+      sandBoxUrl,
+      changeProvider,
+      updateTab,
+      activeTabIndex,
+      providersTabs
+    }
+  }
+})
+</script>
+
+<style lang="postcss" scoped>
+.sandbox,
+.sandbox iframe {
+  @apply w-full rounded-md rounded-tl-none rounded-tr-none overflow-hidden h-64;
+  height: 700px;
+}
+</style>
diff --git a/docs/components/templates/Example.vue b/docs/components/templates/Example.vue
new file mode 100644
index 00000000000..a09688a513b
--- /dev/null
+++ b/docs/components/templates/Example.vue
@@ -0,0 +1,45 @@
+<template>
+  <AppPage>
+    <PageContent :page="page" />
+    <template #prev-next>
+      <PagePrevNext :prev="prev" :next="next" />
+    </template>
+  </AppPage>
+</template>
+
+<script>
+import {
+  defineComponent,
+  ref,
+  useContext,
+  useFetch
+} from '@nuxtjs/composition-api'
+export default defineComponent({
+  props: {
+    page: {
+      type: Object,
+      required: true
+    }
+  },
+  setup (props) {
+    const { $docus } = useContext()
+    const prev = ref(null)
+    const next = ref(null)
+    useFetch(async () => {
+      const [prevLink, nextLink] = await $docus.getPreviousAndNextLink(
+        props.page
+      )
+      prev.value = prevLink
+      next.value = nextLink
+    })
+    return {
+      prev,
+      next
+    }
+  },
+  templateOptions: {
+    aside: true,
+    fluid: false
+  }
+})
+</script>
diff --git a/docs/content/1.getting-started/5.commands.md b/docs/content/1.getting-started/3.commands.md
similarity index 100%
rename from docs/content/1.getting-started/5.commands.md
rename to docs/content/1.getting-started/3.commands.md
diff --git a/docs/content/1.getting-started/3.bridge.md b/docs/content/1.getting-started/4.bridge.md
similarity index 98%
rename from docs/content/1.getting-started/3.bridge.md
rename to docs/content/1.getting-started/4.bridge.md
index 852215a2ee8..671d718d7da 100644
--- a/docs/content/1.getting-started/3.bridge.md
+++ b/docs/content/1.getting-started/4.bridge.md
@@ -1,4 +1,4 @@
-# Bridge
+# Migrating to Bridge
 
 Experience Nuxt 3 features on existing Nuxt 2 projects.
 
@@ -136,7 +136,7 @@ You may also need to add `@vue/runtime-dom` as a devDependency if you are strugg
 ::
 ::alert
 Keep in mind that all options extended from `./.nuxt/tsconfig.json` will be overwritten by the options defined in your `tsconfig.json`.
-Overwriting options such as `"compilerOptions.paths"` with your own configuration will lead Typescript to not factor in the module resolutions from `./.nuxt/tsconfig.json`. This can lead to module resolutions such as `#imports` not being recognized.
+Overwriting options such as `"compilerOptions.paths"` with your own configuration will lead TypeScript to not factor in the module resolutions from `./.nuxt/tsconfig.json`. This can lead to module resolutions such as `#imports` not being recognized.
 
 In case you need to extend options provided by `./.nuxt/tsconfig.json` further, you can use the `alias` property withing your `nuxt.config`. `nuxi` will pick them up and extend `./.nuxt/tsconfig.json` accordingly.
 ::
@@ -241,7 +241,7 @@ export default defineNuxtConfig({
 
     // -- Opt-in features --
 
-    // Use Vite as the bundler instead of Webpack 4
+    // Use Vite as the bundler instead of webpack 4
     // vite: true,
 
     // Enable Nuxt 3 compatible useMeta
diff --git a/docs/content/1.getting-started/4.bridge-composition-api.md b/docs/content/1.getting-started/5.bridge-composition-api.md
similarity index 100%
rename from docs/content/1.getting-started/4.bridge-composition-api.md
rename to docs/content/1.getting-started/5.bridge-composition-api.md
diff --git a/docs/content/1.getting-started/6.migration.md b/docs/content/1.getting-started/6.migration.md
deleted file mode 100644
index 53d86e888a7..00000000000
--- a/docs/content/1.getting-started/6.migration.md
+++ /dev/null
@@ -1,132 +0,0 @@
-# Migration
-
-Nuxt 3 migration guide. Work in progress 🚧
-
-## Nuxt 2 to Nuxt 3
-
-At the moment, there is no Nuxt 2 to Nuxt 3 migration guide nor is it recommended due to potentially more changes coming.
-We are working to provide a stable migration guide and tooling to make it as smooth as possible. Please check [Bridge](/getting-started/bridge) for the alternative.
-
-Some features have been dropped from Nuxt 2, some are yet to be implemented for Nuxt 3 and some are new in Nuxt 3 (and Bridge).
-
-Noticeable and/or breaking changes for Nuxt 3 other than the requirements of Nuxt Bridge are:
-
-::list{type=warning}
-
-- Vue app templates are rewritten
-- Vue upgraded to `3.x`
-- Using `<Suspense>` for async data fetching
-- Webpack `5.x` (if not using `vite`)
-- Components discovery is rewritten
-- Introduced main [`app.vue` component](/docs/directory-structure/app)
-- Introduced new [`layouts` system](/docs/directory-structure/layouts)
-- The [`pages/` directory](/docs/directory-structure/pages) conventions changed
-::
-
-The below table highlights an overall feature comparison:
-
-Feature / Version         | Nuxt 2  | Nuxt 3   | Changes required                | More information
---------------------------|---------|----------|---------------------------------|------------------
-Vue Version               | 2       | 3        | Yes                             |
-`app.vue`                 | ❌      | ✅        | -                               |
-Suspense                  | ❌      | ✅        | -                               |
-Assets                    | ✅      | ✅        | No                              |
-Components                | ✅      | ✅        | No                              |
-Layouts                   | ✅      | ✅        | Yes                             |
-Middleware                | ✅      | ✅        | Yes                             |
-Pages                     | ✅      | ✅        | Yes                             |
-Pages: Dynamic Params     | ✅      | ✅        | Yes                             |
-Pages: _.vue              | ✅      | ✅        | Yes (new naming system)         |
-Plugins                   | ✅      | ✅        | Yes (compatible by default)     |
-Transitions               | ✅      | ✅        | ?                               |
-Options API: `asyncData`  | ✅      | ✅        | Yes (use `defineNuxtComponent`) |
-Options API: `fetch`      | ✅      | ❌        | Use `asyncData` instead         |
-Error Pages               | ✅      | 🚧        | Yes                             | [Handling runtime errors](https://github.com/nuxt/framework/discussions/559)
-Store                     | ✅      | 🚧        | Yes                             | [Global store support](https://github.com/nuxt/framework/discussions/571)
-Static builds             | ✅      | 🚧        |                                 | [Route Caching rules (Hybrid)](https://github.com/nuxt/framework/discussions/560)
-
-### Module Compatibility
-
-All Nuxt 2 modules should be forward compatible with Nuxt 3 as long as they migrate to bridge or if they are already following guidelines.
-
-All (upcoming) modules made with `@nuxt/kit` should be backward compatible with Nuxt 2 projects (even without bridge) as long as they are not depending on a Nuxt 3 / Bridge-only feature.
-
-### Plugin Compatibility
-
-Most Nuxt 2 plugins should be forward compatible with Nuxt 3 with a magical compat layer we inject.
-
-Nuxt 3 plugins are **not** backward compatible with Nuxt 2.
-
-### Vue Compatibility
-
-For plugins using composition API or components, it needs exclusive Vue 2 or Vue 3 support.
-
-By using [vue-demi](https://github.com/vueuse/vue-demi) they should be compatible with both Nuxt 2 and 3.
-
-## Module Migration
-
-When Nuxt 3 users add your module, a compatible module container layer from `@nuxt/kit` is **automatically injected**, so as long as your code is following the guidelines below, it should continue working as-is.
-
-### Test with `@nuxt/bridge`
-
-Migrating to `@nuxt/bridge` is the first and most important step for supporting Nuxt 3.
-
-If you have a fixture or example in your module, add `@nuxt/bridge` package to its config (see [example](/getting-started/bridge#update-nuxtconfig))
-
-### Migrate from CommonJS to ESM
-
-Nuxt 3 natively supports TypeScript and ECMAScript Modules. Please check [Native ES Modules](/concepts/esm) for more info and upgrading.
-
-### Ensure plugins default export
-
-If you inject a Nuxt plugin that does not have `export default` (such as global Vue plugins), ensure you add `export default () => { }` to the end of it.
-
-::code-group
-
-```js [Before]
-// ~/plugins/vuelidate.js
-import Vue from 'vue'
-import Vuelidate from 'vuelidate'
-
-Vue.use(Vuelidate)
-```
-
-```js [After]
-// ~/plugins/vuelidate.js
-import Vue from 'vue'
-import Vuelidate from 'vuelidate'
-
-Vue.use(Vuelidate)
-
-export default () => { }
-```
-
-::
-
-### Avoid runtime modules
-
-With Nuxt 3, Nuxt is now a build-time-only dependency, which means that modules shouldn't attempt to hook into the Nuxt runtime.
-
-Your module should work even if it's only added to [`buildModules`](/docs/directory-structure/nuxt.config#buildmodules) (instead of `modules`). For example:
-
-- Avoid updating `process.env` within a Nuxt module and reading by a nuxt plugin; use [`runtimeConfig`](/docs/directory-structure/nuxt.config#publicruntimeconfig) instead.
-- (*) Avoid depending on runtime hooks like `vue-renderer:*` for production
-- (*) Avoid adding `serverMiddleware` by importing them inside the module. Instead, add them by referencing a file path so that they are independent of the module's context
-
-(*) Unless it is for `nuxt dev` purpose only and guarded with `if (nuxt.options.dev) { }`.
-
-::alert{type=info icon=🔎}
-Continue reading about Nuxt 3 modules in the [Modules guide](/docs/advanced/modules).
-::
-
-### Use TypeScript (optional)
-
-While it is not essential, most of the Nuxt ecosystem is shifting to use TypeScript, so it is highly recommended to consider migration.
-
-::alert{icon=💡}
-You can start migration by renaming `.js` files, to `.ts`. TypeScript is designed to be progressive!
-::
-
-::alert{icon=💡}
-You can use TypeScript syntax for Nuxt 2 and 3 modules and plugins without any extra dependencies.
-::
diff --git a/docs/content/2.concepts/1.introduction.md b/docs/content/2.concepts/1.introduction.md
index a22c8ba0b6d..fb47ee6761a 100644
--- a/docs/content/2.concepts/1.introduction.md
+++ b/docs/content/2.concepts/1.introduction.md
@@ -8,7 +8,7 @@ To understand what is Nuxt, we need to understand what we need to create a moder
 ::list{type=success}
 
 - A JavaScript framework to bring reactivity and web components, we chose [Vue.js](https://v3.vuejs.org).
-- A bundler to support hot module replacement in development and bundle your code for production, we support both [Webpack 5](https://webpack.js.org/) and [Vite](https://vitejs.dev/).
+- A bundler to support hot module replacement in development and bundle your code for production, we support both [webpack 5](https://webpack.js.org/) and [Vite](https://vitejs.dev/).
 - A transpiler in order to write the latest JavaScript syntax while supporting legacy browsers, we use [esbuild](https://esbuild.github.io) for that.
 - A server for serving your application in development, but also to support [server-side rendering](https://vuejs.org/api/ssr.html#server-side-rendering-api) or API routes, Nuxt uses [h3](https://github.com/unjs/h3) for deployment versatility such as serverless, workers, Node.js and unmatched performance.
 - A routing library to handle client-side navigation, we chose [vue-router](https://router.vuejs.org/).
@@ -47,4 +47,4 @@ Ready to try? Head over the [Installation section](/getting-started/installation
 
 ### Are you *courageously* Nuxt?
 
-Take a stab at an open [issue](https://github.com/nuxt/framework/issues). This is actually the best way to learn Nuxt, by actually diving into the code. You may even bring an approach or alternative solution that makes Nuxt even better! So, what are you waiting for? Let's go!  
+Take a stab at an open [issue](https://github.com/nuxt/framework/issues). This is actually the best way to learn Nuxt, by actually diving into the code. You may even bring an approach or alternative solution that makes Nuxt even better! So, what are you waiting for? Let's go!
diff --git a/docs/content/2.concepts/2.vuejs-development.md b/docs/content/2.concepts/2.vuejs-development.md
index 0880aa879b5..9f5b0857581 100644
--- a/docs/content/2.concepts/2.vuejs-development.md
+++ b/docs/content/2.concepts/2.vuejs-development.md
@@ -52,7 +52,7 @@ Nuxt 3 is based on Vue 3. The new Vue major version introduces several changes t
 
 - Better performances
 - Composition API
-- Typescript support
+- TypeScript support
 
 ### Faster rendering
 
@@ -100,13 +100,13 @@ Used with the `setup` keyword in the `<script>` definition, here is the above co
 
 The goal of Nuxt 3 is to provide a great developer experience around the composition API.
 
-- Use auto-imported [Reactivity functions](https://vuejs.org/api/reactivity-core.html) from Vue and Nuxt 3 [built-in composables](https://v3.nuxtjs.org/docs/usage/data-fetching).
+- Use auto-imported [Reactivity functions](https://vuejs.org/api/reactivity-core.html) from Vue and Nuxt 3 [built-in composables](/docs/usage/data-fetching).
 - Write your own auto-imported reusable functions in the `composables/` directory.
 
-### Typescript support
+### TypeScript support
 
-Both Vue 3 and Nuxt 3 are written in Typescript. A fully typed codebase prevents mistakes and documents APIs usage. This doesn’t mean that you have to write your application in Typescript to take advantage of it. With Nuxt 3, you can opt-in by renaming your file from `.js` to `.ts` , or add `<script lang="ts">` in a component.
+Both Vue 3 and Nuxt 3 are written in TypeScript. A fully typed codebase prevents mistakes and documents APIs usage. This doesn’t mean that you have to write your application in TypeScript to take advantage of it. With Nuxt 3, you can opt-in by renaming your file from `.js` to `.ts` , or add `<script lang="ts">` in a component.
 
 ::alert{type="info"}
-🔎 [Read the details about Typescript in Nuxt 3](/concepts/typescript)
+🔎 [Read the details about TypeScript in Nuxt 3](/concepts/typescript)
 ::
diff --git a/docs/content/2.concepts/3.rendering.md b/docs/content/2.concepts/3.rendering.md
index bdfc18f740f..d6e371b7bfe 100644
--- a/docs/content/2.concepts/3.rendering.md
+++ b/docs/content/2.concepts/3.rendering.md
@@ -1,10 +1,10 @@
 # Rendering Modes
 
-Both Browser and Server can interpret Javascript code to render Vue.js components into HTML elements. This step is called **rendering**. Nuxt supports both **client-side** and **universal** rendering. The two approaches have pros and cons that we will cover in this section.
+Both Browser and Server can interpret JavaScript code to render Vue.js components into HTML elements. This step is called **rendering**. Nuxt supports both **client-side** and **universal** rendering. The two approaches have pros and cons that we will cover in this section.
 
 ## Client-side only rendering
 
-Out of the box, a traditional Vue.js application is rendered in the browser (or **client**). Then, Vue.js generates HTML elements after the browser downloads and parses all the Javascript code containing the instructions to create the current interface.
+Out of the box, a traditional Vue.js application is rendered in the browser (or **client**). Then, Vue.js generates HTML elements after the browser downloads and parses all the JavaScript code containing the instructions to create the current interface.
 
 ![Users have to wait for the javascript to be downloaded, parsed and executed before seeing the page's content](/img/concepts/rendering/light/csr.svg){.dark:hidden}
 ![Users have to wait for the javascript to be downloaded, parsed and executed before seeing the page's content](/img/concepts/rendering/dark/csr.svg){.light:hidden}
@@ -14,7 +14,7 @@ While this technique allows building complex and dynamic UIs with smooth page tr
 ### Pros
 
 - **Development speed**: When working entirely on the client-side, we don't have to worry about the server compatibility of the code, for example, by using browser-only APIs like the `window` object.
-- **Cheaper:** Running a server adds a cost of infrastructure as you would need to run on a platform that supports Javascript. We can host Client-only applications on any static server with HTML, CSS, and Javascript files.
+- **Cheaper:** Running a server adds a cost of infrastructure as you would need to run on a platform that supports JavaScript. We can host Client-only applications on any static server with HTML, CSS, and JavaScript files.
 - **Offline:** Because code entirely runs in the browser, it can nicely keep working while the internet is unavailable.
 
 ### Cons
@@ -28,7 +28,7 @@ Client-side rendering is a good choice for heavily interactive **web application
 
 ## Universal Rendering
 
-When the browser requests a URL with universal (client-side + server-side) rendering enabled, the server returns a fully rendered HTML page to the browser. Whether the page has been generated in advance and cached or is rendered on the fly, at some point, Nuxt has run the Javascript (Vue.js) code in a server environment, producing an HTML document. Users immediately get the content of our application, contrary to client-side rendering. This step is similar to traditional **server-side rendering** performed by PHP or Ruby applications.
+When the browser requests a URL with universal (client-side + server-side) rendering enabled, the server returns a fully rendered HTML page to the browser. Whether the page has been generated in advance and cached or is rendered on the fly, at some point, Nuxt has run the JavaScript (Vue.js) code in a server environment, producing an HTML document. Users immediately get the content of our application, contrary to client-side rendering. This step is similar to traditional **server-side rendering** performed by PHP or Ruby applications.
 
 To not lose the benefits of the client-side rendering method, such as dynamic interfaces and pages transitions, the Client loads the javascript code that runs on the Server in the background once the HTML document has been downloaded. It is interpreted again by the browser (hence **Universal rendering**) and Vue.js takes control of the document and enables interactivity.
 
@@ -41,7 +41,7 @@ Universal rendering allows a Nuxt application to provide quick page load times w
 
 ### Pros
 
-- **Performance**: Users can get immediate access to the page's content because browsers can display static content much faster than Javascript-generated one. At the same time, Nuxt preserves the interactivity of a web application when the hydration process happens.
+- **Performance**: Users can get immediate access to the page's content because browsers can display static content much faster than JavaScript-generated one. At the same time, Nuxt preserves the interactivity of a web application when the hydration process happens.
 - **Search Engine Optimization**: Universal rendering delivers the entire HTML content of the page to the browser as a classic server application. Web crawlers can directly index the page's content, which makes Universal rendering a great choice for any content that you want to index quickly.
 
 ### Cons
@@ -57,7 +57,7 @@ Universal rendering is very versatile and can fit almost any use-case, and is es
 
 Client-side and universal rendering are different strategies to display an interface in a browser.
 
-By default, Nuxt uses **universal rendering** to provide a better User experience, performance and optimize search engine indexation, but you can switch rendering modes in [one line of configuration](https://v3.nuxtjs.org/docs/directory-structure/nuxt.config#ssr).
+By default, Nuxt uses **universal rendering** to provide a better User experience, performance and optimize search engine indexation, but you can switch rendering modes in [one line of configuration](/docs/directory-structure/nuxt.config#ssr).
 
 ## Coming in Nuxt 3
 
@@ -75,6 +75,6 @@ At the moment, every page (or **route**) of a Nuxt application must use the same
 
 Traditionally, server-side and universal rendering was only possible using Node.js. Nuxt 3 takes it to another level by directly rendering code in CDN edge workers, reducing latency and costs.
 
-Nitro is the new [server engine](https://v3.nuxtjs.org/concepts/server-engine) that powers Nuxt 3. It offers cross-platform support for Node.js, Deno, Workers, and more. Nitro's design is platform-agnostic and allows rendering a Nuxt application at the edge, closer to your users, allowing replication and further optimizations.
+Nitro is the new [server engine](/concepts/server-engine) that powers Nuxt 3. It offers cross-platform support for Node.js, Deno, Workers, and more. Nitro's design is platform-agnostic and allows rendering a Nuxt application at the edge, closer to your users, allowing replication and further optimizations.
 
-[Deploy your Nuxt 3 application on serverless providers](https://v3.nuxtjs.org/docs/deployment/presets)
+[Deploy your Nuxt 3 application on serverless providers](/docs/deployment/presets)
diff --git a/docs/content/2.concepts/6.typescript.md b/docs/content/2.concepts/6.typescript.md
index 4f1b408a723..ed3edac51f9 100644
--- a/docs/content/2.concepts/6.typescript.md
+++ b/docs/content/2.concepts/6.typescript.md
@@ -31,7 +31,7 @@ Nitro also [auto-generates types](/concepts/server-engine#typed-api-routes) for
 ::
 ::alert
 Keep in mind that all options extended from `./.nuxt/tsconfig.json` will be overwritten by the options defined in your `tsconfig.json`.
-Overwriting options such as `"compilerOptions.paths"` with your own configuration will lead Typescript to not factor in the module resolutions from `./.nuxt/tsconfig.json`. This can lead to module resolutions such as `#imports` not being recognized.
+Overwriting options such as `"compilerOptions.paths"` with your own configuration will lead TypeScript to not factor in the module resolutions from `./.nuxt/tsconfig.json`. This can lead to module resolutions such as `#imports` not being recognized.
 
 In case you need to extend options provided by `./.nuxt/tsconfig.json` further, you can use the `alias` property within your `nuxt.config`. `nuxi` will pick them up and extend `./.nuxt/tsconfig.json` accordingly.
 ::
diff --git a/docs/content/3.docs/1.usage/1.data-fetching.md b/docs/content/3.docs/1.usage/1.data-fetching.md
index 6ac4d6f601e..8e81134e7c6 100644
--- a/docs/content/3.docs/1.usage/1.data-fetching.md
+++ b/docs/content/3.docs/1.usage/1.data-fetching.md
@@ -16,12 +16,12 @@ Within your pages, components and plugins you can use `useAsyncData` to get acce
 const {
   data: Ref<DataT>,
   pending: Ref<boolean>,
-  refresh: (force?: boolean) => Promise<void>,
+  refresh: () => Promise<void>,
   error?: any
 } = useAsyncData(
   key: string,
   handler: (ctx?: NuxtApp) => Promise<Object>,
-  options?: { 
+  options?: {
     lazy: boolean,
     server: boolean,
     watch: WatchSource[]
@@ -40,6 +40,7 @@ const {
   * _transform_: a function that can be used to alter `handler` function result after resolving
   * _pick_: only pick specified keys in this array from `handler` function result
   * _watch_: watch reactive sources to auto refresh
+  * _initialCache_: When set to `false`, will skip payload cache for initial fetch. (defaults to `true`)
 
 Under the hood, `lazy: false` uses `<Suspense>` to block the loading of the route before the data has been fetched. Consider using `lazy: true` and implementing a loading state instead for a snappier user experience.
 
@@ -168,6 +169,66 @@ watch(posts, (newPosts) => {
 </script>
 ```
 
+## Refreshing Data
+
+Sometimes throughout the course of your user's page visit, you may need to refresh the data loaded from the API. This can happen if the user chooses to paginate, filter results, search, etc.
+
+You can make use of the `refresh()` method returned from the `useAsyncData()` composable to refresh the data with different query parameters:
+
+```vue
+<script setup>
+const page = ref(1);
+
+const { data:users, loading, refresh, error } = await useFetch(() => `users?page=${page.value}&take=6`, { baseURL: config.API_BASE_URL }
+);
+
+function previous(){
+  page.value--;
+  refresh();
+}
+
+function next() {
+  page.value++;
+  refresh();
+}
+</script>
+```
+
+The key to making this work is to call the `refresh()` method returned from the `useFetch()` composable when a query parameter has changed.
+
+### `refreshNuxtData`
+
+Invalidate the cache of `useAsyncData`, `useLazyAsyncData`, `useFetch` and `useLazyFetch` and trigger the refetch.
+
+This method is useful if you want to refresh all the data fetching for a current page.
+
+### Usage
+
+```ts
+refreshNuxtData(keys?: string | string[])
+```
+
+Available options:
+
+* `keys`: Provides an array of keys that used in `useAsyncData` to refetch. When it's not specified, all `useAsyncData` and `useFetch` will be refetched.
+
+### Example
+
+```vue
+<template>
+  <div>
+    {{ pending ? 'Loading' : count }}
+  </div>
+  <button @click="refresh">Refresh</button>
+</template>
+
+<script setup>
+const { pending, data: count } = useLazyAsyncData('count', () => $fetch('/api/count'))
+
+const refresh = () => refreshNuxtData('count')
+</script>
+```
+
 ## Isomorphic fetch
 
 When we call `fetch` in the browser, user headers like `cookie` will be directly sent to the API. But during server-side-rendering, since the `fetch` request takes place 'internally' within the server, it doesn't include the user's browser cookies, nor does it pass on cookies from the fetch response.
@@ -295,3 +356,14 @@ export default defineComponent({
   </header>
 </template>
 ```
+
+## Directly calling an API Endpoint
+
+There are instances where you may need to directly call the API. Nuxt 3 provides a globally available `$fetch` method using [unjs/ohmyfetch](https://github.com/unjs/ohmyfetch) (in addition to `fetch`)
+with the same API as the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch).
+
+Using `$fetch` has a number of benefits, including:
+
+It will handle 'smartly' making direct API calls if it's running on the server, or making a client-side call to your API if it's running on the client. (It can also handle calling third-party APIs.)
+
+Plus, it comes with convenience features including automatically parsing responses and stringifying data.
diff --git a/docs/content/3.docs/1.usage/10.teleports.md b/docs/content/3.docs/1.usage/10.teleports.md
new file mode 100644
index 00000000000..7860b9a9855
--- /dev/null
+++ b/docs/content/3.docs/1.usage/10.teleports.md
@@ -0,0 +1,34 @@
+# Teleports
+
+Vue 3 provides the [`<Teleport>` component](https://vuejs.org/guide/built-ins/teleport.html) which allows content to be rendered elsewhere in the DOM, outside of the Vue application.
+
+The `to` target of `<Teleport>` expects a CSS selector string or an actual DOM node. Nuxt currently has SSR support for teleports to `body` only, with client-side support for other targets using a `<ClientOnly>` wrapper.
+
+## Example: body teleport
+
+```vue
+<template>
+  <button @click="open = true">
+    Open Modal
+  </button>
+  <Teleport to="body">
+    <div v-if="open" class="modal">
+      <p>Hello from the modal!</p>
+      <button @click="open = false">
+        Close
+      </button>
+    </div>
+  </Teleport>
+</template>
+```
+
+## Example: client-side teleport
+
+```vue
+  <ClientOnly>
+    <Teleport to="#some-selector">
+      <!-- content -->
+    </Teleport>
+  </ClientOnly>
+</template>
+```
diff --git a/docs/content/3.docs/1.usage/8.cli.md b/docs/content/3.docs/1.usage/8.cli.md
index 9db5ad83d30..809a0a29e47 100644
--- a/docs/content/3.docs/1.usage/8.cli.md
+++ b/docs/content/3.docs/1.usage/8.cli.md
@@ -35,6 +35,8 @@ Option        | Default          | Description
 `--ssl-cert` |`null` | Specify a certificate for https.
 `--ssl-key` |`null` | Specify the key for the https certificate.
 
+The port and host can also be set via NUXT_PORT, PORT, NUXT_HOST or HOST environment variables.
+
 This command sets `process.env.NODE_ENV` to `development`. To override, define `NODE_ENV` in a `.env` file or as command-line argument.
 
 ## Build
@@ -65,6 +67,10 @@ Option        | Default          | Description
 
 This command sets `process.env.NODE_ENV` to `production`. To override, define `NODE_ENV` in a `.env` file or as command-line argument.
 
+::alert{type=info}
+For convenience, in preview mode, your `.env` file will be loaded into `process.env`. (However, in production you will need to ensure your environment variables are set yourself.)
+::
+
 ## Info
 
 ```{bash}
@@ -114,7 +120,7 @@ Option        | Default          | Description
 `TEMPLATE` | - | Specify a template of the file to be generated.
 `NAME` | - | Specify a name of the file that will be created.
 `--cwd` | `.` | The directory of the target application.
-`--force` | `false` | Force override file if already exsits.
+`--force` | `false` | Force override file if it already exists.
 
 **Example:**
 
diff --git a/docs/content/3.docs/2.directory-structure/10.pages.md b/docs/content/3.docs/2.directory-structure/10.pages.md
index e5395764a96..7baa9738071 100644
--- a/docs/content/3.docs/2.directory-structure/10.pages.md
+++ b/docs/content/3.docs/2.directory-structure/10.pages.md
@@ -274,10 +274,10 @@ It is possible to set default [vue-router options](https://router.vuejs.org/api/
 This is the recommaned way to specify router options.
 
 ```js [app/router.options.ts]
-import type { RouterOptions } from '@nuxt/schema'
+import type { RouterConfig } from '@nuxt/schema'
 
 // https://router.vuejs.org/api/#routeroptions
-export default <RouterOptions>{
+export default <RouterConfig>{
 }
 ```
 
diff --git a/docs/content/3.docs/2.directory-structure/3.assets.md b/docs/content/3.docs/2.directory-structure/3.assets.md
index c2f7fefa02a..6c8ebd95530 100644
--- a/docs/content/3.docs/2.directory-structure/3.assets.md
+++ b/docs/content/3.docs/2.directory-structure/3.assets.md
@@ -6,7 +6,7 @@ head.title: Assets directory
 
 # Assets directory
 
-The `assets/` directory is used to add all the website assets that the build tool (Webpack or Vite) will process.
+The `assets/` directory is used to add all the website assets that the build tool (webpack or Vite) will process.
 
 The directory usually contains the following types of files:
 
diff --git a/docs/content/3.docs/3.migration/1.overview.md b/docs/content/3.docs/3.migration/1.overview.md
new file mode 100644
index 00000000000..a84e971ea0a
--- /dev/null
+++ b/docs/content/3.docs/3.migration/1.overview.md
@@ -0,0 +1,21 @@
+# Overview
+
+<!-- ::alert{type=info}
+Nuxt 3 is now in release candidate stage. The main goal of the release candidate stage is to **increase the adoption rate of Nuxt 3** and **increase stability**. However, it is still in continued development. Read more about [Nuxt 3 release candidate status](https://github.com/nuxt/framework/discussions/3447).
+:: -->
+
+::alert{type=info}
+This migration guide is under progress to align with the development of Nuxt 3.
+::
+
+Nuxt 3 is a complete rewrite of Nuxt 2, and also based on a new set of underlying technologies. That means there will be significant changes when migrating a Nuxt 2 app to Nuxt 3, although you can expect migration to become more straightforward as we move toward a stable release.
+
+Some of these significant changes include:
+
+1. Moving from Vue 2 to Vue 3, including defaulting to the composition API and script setup.
+1. Moving from webpack 4 and Babel to Vite or webpack 5 and esbuild.
+1. Moving from a runtime Nuxt dependency to a minimal, standalone server compiled with nitropack.
+
+::alert{type=info}
+If you need to remain on Nuxt 2, but want to benefit from Nuxt 3 features in Nuxt 2, you can alternatively check out [how to get started with Bridge](/getting-started/bridge).
+::
diff --git a/docs/content/3.docs/3.migration/10.bundling.md b/docs/content/3.docs/3.migration/10.bundling.md
new file mode 100644
index 00000000000..b5eca20693d
--- /dev/null
+++ b/docs/content/3.docs/3.migration/10.bundling.md
@@ -0,0 +1,23 @@
+# Build Tooling
+
+We use the following build tools by default:
+
+- [Vite](https://vitejs.dev/) or [webpack](https://webpack.js.org/)
+- [Rollup](https://rollupjs.org/)
+- [PostCSS](https://postcss.org/)
+- [esbuild](https://esbuild.github.io/)
+
+For this reason, most of your previous `build` configuration in `nuxt.config` will now be ignored, including any custom babel configuration.
+
+If you need to configure any of Nuxt's build tools, you can do so in your `nuxt.config`, using the new top-level `vite`, `webpack` and `postcss` keys.
+
+In addition, Nuxt ships with TypeScript support. [Find out more](/docs/concepts/typescript).
+
+## Steps
+
+1. Remove `@nuxt/typescript-build` and `@nuxt/typescript-runtime` from your dependencies and modules.
+1. Remove any unused babel dependencies from your project.
+1. Remove any explicit core-js dependencies.
+1. Migrate `require` to `import`.
+
+<!-- TODO: Enabling webpack builder -->
diff --git a/docs/content/3.docs/3.migration/11.server.md b/docs/content/3.docs/3.migration/11.server.md
new file mode 100644
index 00000000000..107e630a214
--- /dev/null
+++ b/docs/content/3.docs/3.migration/11.server.md
@@ -0,0 +1,12 @@
+# Server
+
+In a built Nuxt 3 application, there is no runtime Nuxt dependency. That means your site will be highly performant, and ultra-slim. But it also means you can no longer hook into runtime Nuxt server hooks.
+
+[Read more about the Nitro server engine](/concepts/server-engine).
+
+## Steps
+
+1. Remove the `render` key in your `nuxt.config`.
+1. Any files in `~/server/api` and `~/server/middleware` will be automatically registered; you can remove them from your `serverMiddleware` array.
+1. Update any other items in your `serverMiddleware` array to point to files or npm packages directly, rather than using inline functions.
+1. If you are adding any server hooks, such as `server:` or `vue-renderer:` you will need to remove these and wait for [nitropack](https://github.com/unjs/nitropack) support for runtime hooks and plugins.
diff --git a/docs/content/3.docs/3.migration/2.configuration.md b/docs/content/3.docs/3.migration/2.configuration.md
new file mode 100644
index 00000000000..f534e8a72be
--- /dev/null
+++ b/docs/content/3.docs/3.migration/2.configuration.md
@@ -0,0 +1,127 @@
+---
+title: Configuration
+---
+# Project Configuration
+
+## `nuxt.config`
+
+The starting point for your Nuxt app remains your `nuxt.config` file.
+
+::alert{icon=📦}
+Nuxt configuration will be loaded using [`unjs/jiti`](https://github.com/unjs/jiti) and [`unjs/c12`](https://github.com/unjs/c12).
+::
+
+### Migration
+
+1. You should migrate to the new `defineNuxtConfig` function that provides a typed configuration schema.
+
+   ::code-group
+
+   ```ts [Nuxt 2]
+   export default {
+     // ...
+   }
+   ```
+
+   ```ts [Nuxt 3]
+   import { defineNuxtConfig } from 'nuxt3'
+   
+   export default defineNuxtConfig({
+     // ...
+   })
+   ```
+
+   ::
+
+1. If you were using `router.extendRoutes` you can migrate to the new `pages:extend` hook:
+
+   ::code-group
+
+   ```ts [Nuxt 2]
+   export default {
+     router: {
+       extendRoutes (routes) {
+         //
+       }
+     }
+   }
+   ```
+
+   ```ts [Nuxt 3]
+   import { defineNuxtConfig } from 'nuxt3'
+   
+   export default defineNuxtConfig({
+     hooks: {
+       'pages:extend' (routes) {
+         //
+       }
+     }
+   })
+   ```
+
+   ::
+
+#### ESM Syntax
+
+Nuxt 3 is an [ESM native framework](/concepts/esm). Although [`unjs/jiti`](https://github.com/unjs/jiti) provides semi compatibility when loading `nuxt.config` file, avoid any usage of `require` and `module.exports` in this file.
+
+1. Change `module.exports` to `export default`
+1. Change `const lib = require('lib')` to `import lib from 'lib'`
+
+#### Async Configuration
+
+In order to make Nuxt loading behavior more predictable, async config syntax is deprecated. Consider using Nuxt hooks for async operations.
+
+#### Dotenv
+
+Nuxt has built-in support for loading `.env` files. Avoid directly importing it from `nuxt.config`.
+
+## Modules
+
+Nuxt and Nuxt Modules are now build-time-only.
+
+### Migration
+
+1. Move all your `buildModules` into `modules`.
+2. Check for Nuxt 3 compatibility of modules.
+
+::alert
+If you are a module author, you can check out [more information about module compatibility](/docs/migration/module-authors) and [our module author guide](/docs/advanced/modules).
+::
+
+## TypeScript
+
+It will be much easier to migrate your application if you use Nuxt's TypeScript integration. This does not mean you need to write your application in TypeScript, just that Nuxt will provide automatic type hints for your editor.
+
+You can read more about Nuxt's TypeScript support [in the docs](/docs/concepts/typescript).
+
+::alert{icon=📦}
+Nuxt can type-check your app using [`vue-tsc`](https://github.com/johnsoncodehk/volar/tree/master/packages/vue-tsc) with `nuxi typecheck` command.
+::
+
+### Migration
+
+1. Create a `tsconfig.json` with the following content:
+
+   ```json
+   {
+     "extends": "./.nuxt/tsconfig.json"
+   }
+   ```
+
+1. Run `npx nuxi prepare` to generate `.nuxt/tsconfig.json`.
+1. Install Volar following the instructions in the [docs](/docs/getting-started/introduction).
+
+## Vue changes
+
+There are a number of changes to what is recommended Vue best practice, as well as a number of breaking changes between Vue 2 and 3.
+
+It is recommended to read the [Vue 3 migration guide](https://v3-migration.vuejs.org/) and in particular the [breaking changes list](https://v3-migration.vuejs.org/breaking-changes/).
+
+It is not currently possible to use the Vue 3 migration build with Nuxt 3 RC.
+
+## Vuex
+
+Nuxt no longer provides a Vuex integration. Instead, the official Vue recommendation is to use `pinia`, which has built-in Nuxt support via a Nuxt module. [Find out more about pinia here](https://pinia.vuejs.org/).
+
+If you want to keep using Vuex, you can manually migrate to Vuex 4 following [these steps](https://vuex.vuejs.org/guide/migrating-to-4-0-from-3-x.html).
diff --git a/docs/content/3.docs/3.migration/20.module-authors.md b/docs/content/3.docs/3.migration/20.module-authors.md
new file mode 100644
index 00000000000..1808620fc68
--- /dev/null
+++ b/docs/content/3.docs/3.migration/20.module-authors.md
@@ -0,0 +1,89 @@
+# Modules
+
+## Module Compatibility
+
+Nuxt 3 has a basic backward compatibility layer for Nuxt 2 modules using `@nuxt/kit` auto wrappers. But there are usually steps to follow to make modules compatible with Nuxt 3 and sometimes, using Nuxt Bridge is required for cross-version compatibility.
+
+We have prepared a [Dedicated Guide](/docs/advanced/modules) for authoring Nuxt 3 ready modules using `@nuxt/kit`. Currently best migration path is to follow it and rewrite your modules. Rest of this guide includes preparation steps if you prefer to avoid a full rewrite yet making modules compatibile with Nuxt 3.
+
+::alert
+You can check for a list of Nuxt 3 ready modules from [Nuxt Modules](https://modules.nuxtjs.org/?version=3.x).
+::
+
+### Plugin Compatibility
+
+Nuxt 3 plugins are **not** fully backward compatible with Nuxt 2.
+
+### Vue Compatibility
+
+Plugins or components using the composition API need exclusive Vue 2 or Vue 3 support.
+
+By using [vue-demi](https://github.com/vueuse/vue-demi) they should be compatible with both Nuxt 2 and 3.
+
+## Module Migration
+
+When Nuxt 3 users add your module, a compatible module container layer from `@nuxt/kit` is **automatically injected**, so as long as your code is following the guidelines below, it should continue working as-is.
+
+### Test with `@nuxt/bridge`
+
+Migrating to `@nuxt/bridge` is the first and most important step for supporting Nuxt 3.
+
+If you have a fixture or example in your module, add `@nuxt/bridge` package to its config (see [example](/getting-started/bridge#update-nuxtconfig))
+
+### Migrate from CommonJS to ESM
+
+Nuxt 3 natively supports TypeScript and ECMAScript Modules. Please check [Native ES Modules](/concepts/esm) for more info and upgrading.
+
+### Ensure plugins default export
+
+If you inject a Nuxt plugin that does not have `export default` (such as global Vue plugins), ensure you add `export default () => { }` to the end of it.
+
+::code-group
+
+```js [Before]
+// ~/plugins/vuelidate.js
+import Vue from 'vue'
+import Vuelidate from 'vuelidate'
+
+Vue.use(Vuelidate)
+```
+
+```js [After]
+// ~/plugins/vuelidate.js
+import Vue from 'vue'
+import Vuelidate from 'vuelidate'
+
+Vue.use(Vuelidate)
+
+export default () => { }
+```
+
+::
+
+### Avoid runtime modules
+
+With Nuxt 3, Nuxt is now a build-time-only dependency, which means that modules shouldn't attempt to hook into the Nuxt runtime.
+
+Your module should work even if it's only added to [`buildModules`](/docs/directory-structure/nuxt.config#buildmodules) (instead of `modules`). For example:
+
+- Avoid updating `process.env` within a Nuxt module and reading by a nuxt plugin; use [`runtimeConfig`](/docs/directory-structure/nuxt.config#publicruntimeconfig) instead.
+- (*) Avoid depending on runtime hooks like `vue-renderer:*` for production
+- (*) Avoid adding `serverMiddleware` by importing them inside the module. Instead, add them by referencing a file path so that they are independent of the module's context
+
+(*) Unless it is for `nuxt dev` purpose only and guarded with `if (nuxt.options.dev) { }`.
+
+::alert{type=info icon=🔎}
+Continue reading about Nuxt 3 modules in the [Modules guide](/docs/advanced/modules).
+::
+
+### Use TypeScript (optional)
+
+While it is not essential, most of the Nuxt ecosystem is shifting to use TypeScript, so it is highly recommended to consider migration.
+
+::alert{icon=💡}
+You can start migration by renaming `.js` files, to `.ts`. TypeScript is designed to be progressive!
+::
+
+::alert{icon=💡}
+You can use TypeScript syntax for Nuxt 2 and 3 modules and plugins without any extra dependencies.
+::
diff --git a/docs/content/3.docs/3.migration/3.auto-imports.md b/docs/content/3.docs/3.migration/3.auto-imports.md
new file mode 100644
index 00000000000..62714d208c3
--- /dev/null
+++ b/docs/content/3.docs/3.migration/3.auto-imports.md
@@ -0,0 +1,17 @@
+# Auto Imports
+
+Nuxt 3 adopts a minimal friction approach, meaning wherever possible components and composables are auto-imported.
+
+::alert{type=info}
+In the rest of the migration documentation, you will notice that key Nuxt and Vue utilities do not have explicit imports. This is not a typo; Nuxt will automatically import them for you, and you should get full type hinting if you have followed [the instructions](/docs/migration/configuration#typescript) to use Nuxt's TypeScript support.
+::
+
+[Read more about auto imports](/concepts/auto-imports)
+
+## Migration
+
+1. If you have been using `@nuxt/components` in Nuxt 2, you can remove `components: true` in your `nuxt.config`. If you had a more complex setup, then note that the component options have changed somewhat. See the [components documentation](/docs/directory-structure/components) for more information.
+
+::alert{type=info}
+You can look at `.nuxt/types/components.d.ts` and `.nuxt/types/auto-imports.d.ts` to see how Nuxt has resolved your components and composable auto-imports.
+::
diff --git a/docs/content/3.docs/3.migration/4.meta.md b/docs/content/3.docs/3.migration/4.meta.md
new file mode 100644
index 00000000000..5aeb4dcf929
--- /dev/null
+++ b/docs/content/3.docs/3.migration/4.meta.md
@@ -0,0 +1,106 @@
+# Meta Tags
+
+Nuxt 3 provides several different ways to manage your meta tags.
+
+1. Through your `nuxt.config`.
+1. Through the `useMeta` [composable](/docs/usage/meta-tags#usemeta-composable)
+1. Through [global meta components](/docs/usage/meta-tags#meta-components)
+
+You can customize `title`, `base`, `script`, `style`, `meta`, `link`, `htmlAttrs` and `bodyAttrs`.
+
+::alert{icon=📦}
+Nuxt currently uses [`vueuse/head`](https://github.com/vueuse/head) to manage your meta tags, but implementation details may change.
+::
+
+[Read more about meta tags](/docs/usage/meta-tags).
+
+## Migration
+
+1. In your `nuxt.config`, rename `head` to `meta`. Consider moving this shared meta configuration into your `app.vue` instead. (Note that objects no longer have a `hid` key for deduplication.)
+1. In your components, rename your `head` option to `meta`. If you need to access the component state, you should migrate to using `useMeta`. You might also consider using the built-in meta-components.
+
+### Example: `useMeta`
+
+::code-group
+
+```vue [Nuxt 2]
+<script>
+export default {
+  data: () => ({
+    title: 'My App',
+    description: 'My App Description'
+  })
+  head () {
+    return {
+      title: this.title,
+      meta: [{
+        hid: 'description',
+        name: 'description',
+        content: this.description
+      }]
+    }
+  }
+}
+</script>
+```
+
+```vue [Nuxt 3]
+<script setup>
+const title = ref('My App')
+const description = ref('My App Description')
+
+// This will be reactive even you change title/description above
+useMeta({
+  title,
+  meta: [{
+    name: 'description',
+    content: description
+  }]
+})
+</script>
+```
+
+::
+
+### Example: built-in meta-components
+
+Nuxt 3 also provides meta components that you can use to accomplish the same task. While these components look similar to HTML tags, they are provided by Nuxt and have similar functionality.
+
+::code-group
+
+```vue [Nuxt 2]
+<script>
+export default {
+  head () {
+    return {
+      title: 'My App',
+      meta: [{
+        hid: 'description',
+        name: 'description',
+        content: 'My App Description'
+      }]
+    }
+  }
+}
+</script>
+```
+
+```vue [Nuxt 3]
+<template>
+  <div>
+    <Head>
+      <Title>My App</Title>
+      <Meta name="description" content="My app description"/>
+    </Head>
+    <!-- -->
+  </div>
+</template>  
+```
+
+::
+
+::alert{icon=👉}
+
+1. Make sure you use capital letters for these component names to distinguish them from native HTML elements (`<Title>` rather than `<title>`).
+1. You can place these components anywhere in your template for your page.
+::
diff --git a/docs/content/3.docs/3.migration/5.plugins-and-middleware.md b/docs/content/3.docs/3.migration/5.plugins-and-middleware.md
new file mode 100644
index 00000000000..e848a16af77
--- /dev/null
+++ b/docs/content/3.docs/3.migration/5.plugins-and-middleware.md
@@ -0,0 +1,73 @@
+# Plugins and Middleware
+
+## Plugins
+
+Plugins now have a different format, and take only one argument (`nuxtApp`). Read more in [the docs](/docs/directory-structure/plugins).
+
+::code-group
+
+```js [Nuxt 2]
+export default (ctx, inject) => {
+  inject('injected', () => 'my injected function')
+})
+```
+
+```ts [Nuxt 3]
+export default defineNuxtPlugin(nuxtApp => {
+  // now available on `nuxtApp.$injected`
+  nuxtApp.provide('injected', () => 'my injected function')
+
+  // You can alternatively use this format, which comes with automatic type support
+  return {
+    provide: {
+      injected: () => 'my injected function'
+    }
+  }
+})
+```
+
+::
+
+::alert{icon=👉}
+You can read more about the format of `nuxtApp` in [the docs](/docs/usage/nuxt-app).
+::
+
+### Migration
+
+1. Migrate your plugins to use the `defineNuxtPlugin` helper function.
+1. Remove any entries in your `nuxt.config` plugins array that are located in your `plugins/` folder. All files in this directory at the top level (and any index files in any subdirectories) will be automatically registered. Instead of setting `mode` to `client` or `server`, you can indicate this in the file name. For example, `~/plugins/my-plugin.client.ts` will only be loaded on client-side.
+
+## Route middleware
+
+Route middleware has a different format.
+
+::code-group
+
+```js [Nuxt 2]
+export default function ({ store, redirect }) {
+  // If the user is not authenticated
+  if (!store.state.authenticated) {
+    return redirect('/login')
+  }
+}
+```
+
+```ts [Nuxt 3]
+export default defineNuxtRouteMiddleware((to, from) => {
+  const auth = useState('auth')
+  if (!auth.value.authenticated) {
+    return navigateTo('/login')
+  }
+})
+```
+
+::
+
+Much like Nuxt 2, route middleware placed in your `~/middleware` folder is automatically registered. You can then specify it by name in a component. However, this is done with `definePageMeta` rather than as a component option.
+
+`navigateTo` is one of a number of route helper functions, which you can read more about in [the documentation about route middleware](/docs/directory-structure/middleware).
+
+### Migration
+
+1. Migrate your route middleware to use the `defineNuxtRouteMiddleware` helper function.
+1. Any global middleware (such as in your `nuxt.config`) can be placed in your `~/middleware` folder with a `.global` extension, for example `~/middleware/auth.global.ts`.
diff --git a/docs/content/3.docs/3.migration/6.pages-and-layouts.md b/docs/content/3.docs/3.migration/6.pages-and-layouts.md
new file mode 100644
index 00000000000..aee31e2160c
--- /dev/null
+++ b/docs/content/3.docs/3.migration/6.pages-and-layouts.md
@@ -0,0 +1,174 @@
+# Pages and Layouts
+
+## `app.vue`
+
+Nuxt 3 provides a central entrypoint to your app via `~/app.vue`. If you don't have an `app.vue` file in your source directory, Nuxt will use its own default version.
+
+This file is a great place to put any custom code that needs to be run once when your app starts up, as well as any components that are present on every page of your app. For example, if you only have one layout, you can move this to `app.vue` instead.
+
+[Read more about `app.vue`](/docs/directory-structure/app).
+
+### Migration
+
+1. Consider creating an `app.vue` file and including any logic that needs to run once at the top-level of your app. You can check out [an example here](/docs/directory-structure/app).
+
+## Layouts
+
+If you are using layouts in your app for multiple pages, there is only a slight change required.
+
+In Nuxt 2, the `<Nuxt>` component is used within a layout to render the current page. In Nuxt 3, layouts use slots instead, so you will have to replace that component with a `<slot />`. This also allows advanced use cases with named and scoped slots. [Read more about layouts](/docs/directory-structure/layouts).
+
+You will also need to change how you define the layout used by a page using the `definePageMeta` compiler macro. Layouts will be kebab-cased. So `layouts/customLayout.vue` becomes `custom-layout` when referenced in your page.
+
+### Migration
+
+1. Replace `<Nuxt />` with `<slot />`
+1. Use `definePageMeta` to select the layout used by your page.
+1. Move `~/layouts/_error.vue` to `~/error.vue`. See [the error handling docs](/docs/usage/error-handling).
+
+### Example: `~/layouts/custom.vue`
+
+::code-group
+
+```diff [layouts/custom.vue]
+  <template>
+    <div id="app-layout">
+      <main>
+-       <Nuxt />
++       <slot />
+      </main>
+    </div>
+  </template>
+```
+
+```diff [pages/index.vue]
+  <script>
++ definePageMeta({ layout: 'custom' })
+  export default {
+-   layout: 'custom'
+  }
+  </script>
+```
+
+::
+
+## Pages
+
+Nuxt 3 ships with an optional `vue-router` integration triggered by the existence of a `pages/` directory in your source directory. If you only have a single page, you may consider instead moving it to `app.vue` for a lighter build.
+
+### Dynamic routes
+
+The format for defining dynamic routes in Nuxt 3 is slightly different from Nuxt 2, so you may need to rename some of the files within `pages/`.
+
+1. Where you previously used `_id` to define a dynamic route parameter you now use `[id]`.
+1. Where you previously used `_.vue` to define a catch-all route, you now use `[...slug].vue`.
+
+### Nested routes
+
+In Nuxt 2, you will have defined any nested routes (with parent and child components) using `<Nuxt>` and `<NuxtChild>`. In Nuxt 3, these have been replaced with a single `<NuxtPage>` component.
+
+### Page keys and keep-alive props
+
+If you were passing a custom page key or keep-alive props to `<Nuxt>`, you will now use `definePageMeta` to set these options.
+
+See [more about migrating Nuxt component hooks](/docs/migration/nuxt-hooks).
+
+### Page and layout transitions
+
+If you have been defining transitions for your page or layout directly in your component options, you will now need to use `definePageMeta` to set the transition.
+
+[Read more about `pages/`](/docs/directory-structure/pages).
+
+### Migration
+
+1. Rename any pages with dynamic parameters to match the new format.
+1. Update `<Nuxt>` and `<NuxtChild>` to be `<NuxtPage>`.
+1. If you're using the Composition API, you can also migrate `this.$route` and `this.$router` to use `useRoute` and `useRouter` composables.
+
+#### Example: Dynamic Routes
+
+::code-group
+
+``` [Nuxt 2]
+- URL: /users
+- Page: /pages/users/index.vue
+
+- URL: /users/some-user-name
+- Page: /pages/users/_user.vue
+- Usage: params.user
+
+- URL: /users/some-user-name/edit
+- Page: /pages/users/_user/edit.vue
+- Usage: params.user
+
+- URL: /users/anything-else
+- Page: /pages/users/_.vue
+- Usage: params.pathMatch
+```
+
+``` [Nuxt 3]
+- URL: /users
+- Page: /pages/users/index.vue
+
+- URL: /users/some-user-name
+- Page: /pages/users/[user].vue
+- Usage: params.user
+
+- URL: /users/some-user-name/edit
+- Page: /pages/users/[user]/edit.vue
+- Usage: params.user
+
+- URL: /users/anything-else
+- Page: /pages/users/[...slug].vue
+- Usage: params.slug
+```
+
+::
+
+#### Example: Nested routes and `definePageMeta`
+
+::code-group
+
+```vue [Nuxt 2]
+<template>
+  <div>
+    <NuxtChild keep-alive :keep-alive-props="{ exclude: ['modal'] }" :nuxt-child-key="$route.slug" />
+  </div>
+</template>
+
+<script>
+export default {
+  transition: 'page' // or { name: 'page' }
+}
+</script>
+```
+
+```vue [Nuxt 3]
+<template>
+  <div>
+    <NuxtPage />
+  </div>
+</template>
+
+<script setup>
+// This compiler macro works in both <script> and <script setup>
+definePageMeta({
+  // you can also pass a string or a computed property
+  key: route => route.slug,
+  transition: {
+    name: 'page',
+  },
+  keepAlive: {
+    exclude: ['modal']
+  },
+})
+</script>
+```
+
+::
+
+## NuxtLink component
+
+Most of the syntax and functionality are the same for the global [NuxtLink](/docs/usage/nuxt-link#nuxtlink) component. If you have been using the shortcut `<NLink>` format, you should update this to use `<NuxtLink>`.
+
+`<NuxtLink>` is now a drop-in replacement for _all_ links, even external ones. You can read more about it, and how to extend it to provide your own link component, [in the docs](/docs/usage/nuxt-link#nuxtlink).
diff --git a/docs/content/3.docs/3.migration/7.component-options.md b/docs/content/3.docs/3.migration/7.component-options.md
new file mode 100644
index 00000000000..698fe020654
--- /dev/null
+++ b/docs/content/3.docs/3.migration/7.component-options.md
@@ -0,0 +1,148 @@
+# Component Options
+
+## `asyncData` and `fetch` component options
+
+Nuxt 3 provides new options for [fetching data from an API](/docs/usage/data-fetching).
+
+<!-- TODO: Intro to <script setup> -->
+<!-- TODO: Mention about options compatibility with asyncData -->
+
+### Isomorphic fetch
+
+In Nuxt 2 you might use `@nuxtjs/axios` or `@nuxt/http` to fetch your data - or just the polyfilled global `fetch`.
+
+In Nuxt 3 you can use a globally available `fetch` method that has the same API as [the Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) or `$fetch` method which is using [unjs/ohmyfetch](https://github.com/unjs/ohmyfetch). It has a number of benefits, including:
+
+1. It will handle 'smartly' making [direct API calls](/concepts/server-engine#direct-api-calls) if it's running on the server, or making a client-side call to your API if it's running on the client. (It can also handle calling third-party APIs.)
+
+2. Plus, it comes with convenience features including automatically parsing responses and stringifying data.
+
+You can read more [about direct API calls](/concepts/server-engine#direct-api-calls) or [fetching data](/docs/usage/data-fetching).
+
+### Using composables
+
+Nuxt 3 provides new composables for fetching data: `useAsyncData` and `useFetch`. They each have 'lazy' variants (`useLazyAsyncData` and `useLazyFetch`), which do not block client-side navigation.
+
+In Nuxt 2, you'd fetch your data in your component using a syntax similar to:
+
+```ts
+export default {
+  async asyncData({ params, $http }) {
+    const post = await $http.$get(`https://api.nuxtjs.dev/posts/${params.id}`)
+    return { post }
+  },
+  // or alternatively
+  fetch () {
+    this.post = await $http.$get(`https://api.nuxtjs.dev/posts/${params.id}`)
+  }
+}
+```
+
+Within your methods and templates, you could use the `post` variable similar how you'd use any other piece of data provided by your component.
+
+With Nuxt 3, you can perform this data fetching using composables in your `setup()` method or `<script setup>` tag:
+
+```vue
+<script setup>
+  // Define params wherever, through `defineProps()`, `useRoute()`, etc.
+  const { data: post, refresh } = await useAsyncData('post', () => $fetch(`https://api.nuxtjs.dev/posts/${params.id}`) )
+  // Or instead - useFetch is a convenience wrapper around useAsyncData when you're just performing a simple fetch
+  const { data: post, refresh } = await useFetch(`https://api.nuxtjs.dev/posts/${paramsÌ.id}`)
+</script>
+```
+
+You can now use `post` inside of your Nuxt 3 template, or call `refresh` to update the data.
+
+::alert{type=info}
+Despite the names, `useFetch` is not a direct replacement of the `fetch()` hook. Rather, `useAsyncData` replaces both hooks and is most customizable; it can do more than simply fetching data from an endpoint. `useFetch` is a convenience wrapper around `useAsyncData` for simply fetching data from an endpoint.
+::
+
+### Migration
+
+1. Replace the `asyncData` hook with `useAsyncData` or `useFetch` in your page/component.
+1. Replace the `fetch` hook with `useAsyncData` or `useFetch` in your component.
+
+## `head`
+
+See [meta tag migration](/docs/migration/meta).
+
+## `key`
+
+You can now define a key within the `definePageMeta` compiler macro.
+
+```diff [pages/index.vue]
+- <script>
+- export default {
+-   key: 'index'
+-   // or a method
+-   // key: route => route.fullPath
+- }
++ <script setup>
++ definePageMeta({
++   key: 'index'
++   // or a method
++   // key: route => route.fullPath
++ })
+  </script>
+```
+
+### Migration
+
+1. Migrate `key` from component options to `definePageMeta`.
+
+## `layout`
+
+See [layout migration](/docs/migration/pages-and-layouts).
+
+## `loading`
+
+This feature is not yet supported in Nuxt 3.
+
+## `middleware`
+
+See [middleware migration](/docs/migration/plugins-and-middleware).
+
+## `scrollToTop`
+
+This feature is not yet supported in Nuxt 3. If you want to overwrite the default scroll behavior of `vue-router`, you can do so in `~/app/router.options.ts` (see [docs](/docs/directory-structure/pages/#router-options)) for more info.
+
+## `transition`
+
+See [layout migration](/docs/migration/pages-and-layouts).
+
+## `validate`
+
+There is no longer a validate hook in Nuxt 3. Instead, you can create a custom middleware function, or directly throw an error in the setup function of the page.
+
+```diff [pages/users/[id].vue]
+- <script>
+- export default {
+-   async validate({ params, query, store }) {
+-     return true // if valid
+-   }
+- }
++ <script setup>
++ definePageMeta({
++   middleware: [
++     async function (to, from) {
++       const nuxtApp = useNuxtApp()
++       if (!valid) {
++         return abortNavigation('Page not found')
++       }
++     }
++   ]
++ })
+  </script>
+```
+
+## `watchQuery`
+
+This is not supported in Nuxt 3. Instead, you can directly use a watcher to trigger refetching data.
+
+```vue [pages/users/[id].vue]
+<script setup>
+const route = useRoute()
+const { data, refresh } = await useFetch('/api/user')
+watch(() => route.query, () => refresh())
+</script>
+```
diff --git a/docs/content/3.docs/3.migration/8.runtime-config.md b/docs/content/3.docs/3.migration/8.runtime-config.md
new file mode 100644
index 00000000000..17999ff85ec
--- /dev/null
+++ b/docs/content/3.docs/3.migration/8.runtime-config.md
@@ -0,0 +1,49 @@
+# Runtime Config
+
+If you wish to reference environment variables within your Nuxt 3 app, you will need to use runtime config.
+
+When referencing these variables within your components, you will have to use the `useRuntimeConfig` composable in your setup method (or Nuxt plugin). In the Nitro portion of your app, you can import directly from `#config`.
+
+[Read more about runtime config](/docs/usage/runtime-config).
+
+## Migration
+
+1. Add any environment variables you use in your app to your `publicRuntimeConfig` or `privateRuntimeConfig`.
+1. Migrate `process.env` to `useRuntimeConfig` throughout the Vue part of your app.
+
+## Example
+
+::code-group
+
+```ts [nuxt.config.ts]
+import { defineNuxtConfig } from 'nuxt3'
+
+export default defineNuxtConfig({
+  publicRuntimeConfig: {
+    BASE_URL: process.env.BASE_URL || 'https://nuxtjs.org'
+  },
+  privateRuntimeConfig: {
+    // variables that can only be accessed on server-side
+  },
+})
+```
+
+```vue [pages/index.vue]
+<script setup>
+  const config = useRuntimeConfig();
+  // instead of process.env.BASE_URL you will now access config.BASE_URL
+</script>
+```
+
+```ts [server/api/hello.ts]
+import config from '#config';
+
+export default (req, res) => {
+  // you can now access config.BASE_URL
+  return {
+    baseURL: config.BASE_URL
+  }
+}
+```
+
+::
diff --git a/docs/content/3.docs/3.migration/index.md b/docs/content/3.docs/3.migration/index.md
new file mode 100644
index 00000000000..5fb80179f5a
--- /dev/null
+++ b/docs/content/3.docs/3.migration/index.md
@@ -0,0 +1,6 @@
+---
+navigation.collapse: true
+layout.aside: true
+layout.asideClass: ''
+navigation.redirect: /docs/migration/overview
+---
diff --git a/docs/content/3.docs/4.advanced/5.testing.md b/docs/content/3.docs/4.advanced/5.testing.md
new file mode 100644
index 00000000000..8f7dcbf2078
--- /dev/null
+++ b/docs/content/3.docs/4.advanced/5.testing.md
@@ -0,0 +1,190 @@
+# Testing
+
+::alert{icon=👉}
+Test utils are still in development and the API and behavior may change. Currently it's for module authors to preview but not yet ready for testing production apps.
+::
+
+In Nuxt 3, we have a rewritten version of `@nuxt/test-utils` available as `@nuxt/test-utils-edge`. We support [Vitest](https://github.com/vitest-dev/vitest) and [Jest](https://jestjs.io/) as the test runner.
+
+## Installation
+
+```bash
+yarn add --dev @nuxt/test-utils-edge vitest
+```
+
+## Setup
+
+In each describe block where you are taking advantage of the `@nuxt/test-utils` helper methods, you will need to set up the test context before beginning.
+
+```ts
+import { describe, test } from 'vitest'
+import { setup, $fetch } from '@nuxt/test-utils-edge'
+
+describe('My test', () => {
+  await setup({
+    // test context options
+  })
+
+  test('my test', () => {
+    // ...
+  })
+})
+```
+
+Behind the scenes, `setup` performs a number of tasks in `beforeAll`, `beforeEach`, `afterEach` and `afterAll` to setup the Nuxt test environment correctly.
+
+## Options
+
+### Nuxt configuration
+
+#### rootDir
+
+Path to a directory with a Nuxt app to be put under test.
+
+* Type: `string`
+* Default: `'.'`
+
+#### configFile
+
+Name of the configuration file.
+
+* Type: `string`
+* Default: `'nuxt.config'
+
+<!-- 
+#### config
+
+Object with configuration overrides.
+
+* Type: `NuxtConfig`
+* Default: `{}` -->
+
+### Setup timings
+
+#### setupTimeout
+
+The amount of time (in milliseconds) to allow for `setupTest` to complete its work (which could include building or generating files for a Nuxt application, depending on the options that are passed).
+
+* Type: `number`
+* Default: `60000`
+
+### Features to enable
+
+#### server
+
+Whether to launch a server to respond to requests in the test suite.
+
+* Type: `boolean`
+* Default: `true`
+
+#### build
+
+Whether to run a separate build step.
+
+* Type: `boolean`
+* Default: `true` (`false` if `browser` or `server` is disabled)
+
+#### browser
+
+Under the hood, Nuxt test utils uses [`playwright`](https://playwright.dev/) to carry out browser testing. If this option is set, a browser will be launched and can be controlled in the subsequent test suite. (More info can be found [here](/api-reference/browser-testing).)
+
+* Type: `boolean`
+* Default: `false`
+
+#### browserOptions
+
+* Type: `object` with the following properties
+  * **type**: The type of browser to launch - either `chromium`, `firefox` or `webkit`
+  * **launch**: `object` of options that will be passed to playwright when launching the browser. See [full API reference](https://playwright.dev/#version=master&path=docs%2Fapi.md&q=browsertypelaunchoptions).
+
+#### runner
+
+Specify the runner for the test suite. Currently [Vitest](https://vitest.dev/) is recommend.
+
+* Type: `'vitest' | 'jest'`
+* Default: `'vitest'`
+
+## APIs
+
+### APIs for rendering testing
+
+#### $fetch(url)
+
+Get the HTML of a server-rendered page.
+
+```ts
+import { $fetch } from '@nuxt/test-utils'
+
+const html = await $fetch('/')
+```
+
+#### fetch(url)
+
+Get the response of a server-rendered page.
+
+```ts
+import { fetch } from '@nuxt/test-utils'
+
+const res = await fetch('/')
+const { body, headers } = res
+```
+
+#### url(path)
+
+Get the full URL for a given page (including the port the test server is running on.)
+
+```ts
+import { url } from '@nuxt/test-utils'
+
+const pageUrl = url('/page')
+// 'http://localhost:6840/page'
+```
+
+## Testing Modules
+
+### Fixture Setup
+
+To test the modules we create, we could setup some Nuxt apps as fixtures and test their behaviors. For example, we can create a simple Nuxt app under `./test/fixture` with the configuration like:
+
+```ts
+// nuxt.config.js
+import { defineNuxtConfig } from 'nuxt3'
+import MyModule from '../../src'
+
+export default defineNuxtConfig({
+  modules: [
+    MyModule
+  ]
+})
+```
+
+### Tests Setup
+
+We can create a test file and use the `rootDir` to test the fixture.
+
+```ts
+// basic.test.js
+import { describe, it } from 'vitest'
+import { setup, $fetch } from '@nuxt/test-utils-edge'
+
+describe('ssr', async () => {
+  await setup({
+    rootDir: fileURLToPath(new URL('./fixture', import.meta.url)),
+  })
+
+  it('renders the index page', async () => {
+    // Get response to a server-rendered page with `$fetch`.
+    const html = await $fetch('/')
+
+    expect(html).toContain('<a>A Link</a>')
+  })
+})
+```
+
+For more usage, please reference to our [tests for Nuxt 3 framework](https://github.com/nuxt/framework/blob/main/test/basic.test.ts).
+
+## Testing in a browser
+
+::alert{icon=🚧}
+We are working on it, stay tuned!
+::
diff --git a/docs/content/3.docs/3.deployment/1.azure.md b/docs/content/3.docs/8.deployment/1.azure.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/1.azure.md
rename to docs/content/3.docs/8.deployment/1.azure.md
diff --git a/docs/content/3.docs/3.deployment/2.cloudflare.md b/docs/content/3.docs/8.deployment/2.cloudflare.md
similarity index 98%
rename from docs/content/3.docs/3.deployment/2.cloudflare.md
rename to docs/content/3.docs/8.deployment/2.cloudflare.md
index 65f329f4d45..c2f36acdec1 100644
--- a/docs/content/3.docs/3.deployment/2.cloudflare.md
+++ b/docs/content/3.docs/8.deployment/2.cloudflare.md
@@ -72,7 +72,7 @@ Publish:
 wrangler publish
 ```
 
-## Deploy within CI/CD using Github Actions
+## Deploy within CI/CD using GitHub Actions
 
 Create a token according to [the wrangler action docs](https://github.com/marketplace/actions/deploy-to-cloudflare-workers-with-wrangler#authentication) and set `CF_API_TOKEN` in your repository config on GitHub.
 
diff --git a/docs/content/3.docs/3.deployment/3.firebase.md b/docs/content/3.docs/8.deployment/3.firebase.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/3.firebase.md
rename to docs/content/3.docs/8.deployment/3.firebase.md
diff --git a/docs/content/3.docs/3.deployment/4.netlify.md b/docs/content/3.docs/8.deployment/4.netlify.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/4.netlify.md
rename to docs/content/3.docs/8.deployment/4.netlify.md
diff --git a/docs/content/3.docs/3.deployment/5.pm2.md b/docs/content/3.docs/8.deployment/5.pm2.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/5.pm2.md
rename to docs/content/3.docs/8.deployment/5.pm2.md
diff --git a/docs/content/3.docs/3.deployment/6.vercel.md b/docs/content/3.docs/8.deployment/6.vercel.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/6.vercel.md
rename to docs/content/3.docs/8.deployment/6.vercel.md
diff --git a/docs/content/3.docs/3.deployment/99.presets.md b/docs/content/3.docs/8.deployment/99.presets.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/99.presets.md
rename to docs/content/3.docs/8.deployment/99.presets.md
diff --git a/docs/content/3.docs/3.deployment/99.presets/custom.md b/docs/content/3.docs/8.deployment/99.presets/custom.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/99.presets/custom.md
rename to docs/content/3.docs/8.deployment/99.presets/custom.md
diff --git a/docs/content/3.docs/3.deployment/99.presets/lambda.md b/docs/content/3.docs/8.deployment/99.presets/lambda.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/99.presets/lambda.md
rename to docs/content/3.docs/8.deployment/99.presets/lambda.md
diff --git a/docs/content/3.docs/3.deployment/99.presets/node.md b/docs/content/3.docs/8.deployment/99.presets/node.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/99.presets/node.md
rename to docs/content/3.docs/8.deployment/99.presets/node.md
diff --git a/docs/content/3.docs/3.deployment/99.presets/server.md b/docs/content/3.docs/8.deployment/99.presets/server.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/99.presets/server.md
rename to docs/content/3.docs/8.deployment/99.presets/server.md
diff --git a/docs/content/3.docs/3.deployment/99.presets/service-worker.md b/docs/content/3.docs/8.deployment/99.presets/service-worker.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/99.presets/service-worker.md
rename to docs/content/3.docs/8.deployment/99.presets/service-worker.md
diff --git a/docs/content/3.docs/3.deployment/index.md b/docs/content/3.docs/8.deployment/index.md
similarity index 100%
rename from docs/content/3.docs/3.deployment/index.md
rename to docs/content/3.docs/8.deployment/index.md
diff --git a/docs/content/3.docs/4.advanced/1.nuxt.md b/docs/content/3.docs/9.advanced/1.nuxt.md
similarity index 100%
rename from docs/content/3.docs/4.advanced/1.nuxt.md
rename to docs/content/3.docs/9.advanced/1.nuxt.md
diff --git a/docs/content/3.docs/4.advanced/2.modules.md b/docs/content/3.docs/9.advanced/2.modules.md
similarity index 97%
rename from docs/content/3.docs/4.advanced/2.modules.md
rename to docs/content/3.docs/9.advanced/2.modules.md
index 912bb2c0c57..1800bab0ae0 100644
--- a/docs/content/3.docs/4.advanced/2.modules.md
+++ b/docs/content/3.docs/9.advanced/2.modules.md
@@ -19,7 +19,7 @@ Starter template and module starter is a standard path of creating a Nuxt module
 
 **Next steps:**
 
-- Open `my-module` in IDE of your choice (VSCode is recommended)
+- Open `my-module` in IDE of your choice (Visual Studio Code is recommended)
 - Install dependencies using the package manager of your choice (Yarn is recommended)
 - Ensure local files are generated using `npm run dev:prepare`
 - Start playground using `npm run dev`
@@ -106,7 +106,7 @@ Result of `defineNuxtModule` is a wrapper function with `(inlineOptions, nuxt)`
 - Automatically register Nuxt hooks
 - Automatically check for compatibility issues based on module meta
 - Expose `getOptions` and `getMeta` for internal usage of Nuxt
-- Ensuring backward and upward compatibility as long as the module is using `defineNuxtmodule` from the latest version of `@nuxt/kit`
+- Ensuring backward and upward compatibility as long as the module is using `defineNuxtModule` from the latest version of `@nuxt/kit`
 - Integration with module builder tooling
 
 ## Best practices
@@ -125,7 +125,7 @@ Nuxt Modules should provide an explicit prefix for any exposed configuration, pl
 
 Ideally you should prefix them with your module name (If your module is called `nuxt-foo`, expose `<FooButton>` and `useFooBar()` and **not** `<Foo>` and `useBar()`)
 
-### Be Typescript Friendly
+### Be TypeScript Friendly
 
 Nuxt 3, has first-class typescript integration for the best developer experience.
 
diff --git a/docs/content/3.docs/4.advanced/3.kit.md b/docs/content/3.docs/9.advanced/3.kit.md
similarity index 100%
rename from docs/content/3.docs/4.advanced/3.kit.md
rename to docs/content/3.docs/9.advanced/3.kit.md
diff --git a/docs/content/3.docs/4.advanced/4.hooks.md b/docs/content/3.docs/9.advanced/4.hooks.md
similarity index 100%
rename from docs/content/3.docs/4.advanced/4.hooks.md
rename to docs/content/3.docs/9.advanced/4.hooks.md
diff --git a/docs/content/4.examples/0.essentials/hello-world.md b/docs/content/4.examples/0.essentials/hello-world.md
new file mode 100644
index 00000000000..243c63daf23
--- /dev/null
+++ b/docs/content/4.examples/0.essentials/hello-world.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Hello world
+
+A minimal Nuxt 3 application only requires the `app.vue` and `nuxt.config.js` files.
+
+::alert{type=info icon=👉}
+Read more about [installation](/getting-started/installation).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/essentials/hello-world" file="app.vue"}
diff --git a/docs/content/4.examples/1.app/error-handling.md b/docs/content/4.examples/1.app/error-handling.md
new file mode 100644
index 00000000000..83982209455
--- /dev/null
+++ b/docs/content/4.examples/1.app/error-handling.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Error Handling
+
+This example shows how to handle errors in different contexts: pages, plugins, components and middleware.
+
+::alert{type=info icon=👉}
+Learn more about [error handling](/docs/usage/error-handling).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/app/errors" file="app.vue"}
diff --git a/docs/content/4.examples/1.app/plugins.md b/docs/content/4.examples/1.app/plugins.md
new file mode 100644
index 00000000000..93fa2e938f2
--- /dev/null
+++ b/docs/content/4.examples/1.app/plugins.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Plugins
+
+This example shows how to use the `plugins/` directory to auto-register plugins.
+
+::alert{type=info icon=👉}
+Learn more about [plugins](/docs/directory-structure/plugins).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/app/plugins" file="app.vue"}
diff --git a/docs/content/4.examples/1.app/teleport.md b/docs/content/4.examples/1.app/teleport.md
new file mode 100644
index 00000000000..9efd5d149db
--- /dev/null
+++ b/docs/content/4.examples/1.app/teleport.md
@@ -0,0 +1,15 @@
+---
+template: Example
+---
+
+# Teleport
+
+Vue 3 provides the [`<Teleport>` component](https://vuejs.org/guide/built-ins/teleport.html) which allows content to be rendered elsewhere in the DOM, outside of the Vue application.
+
+This example shows how to use the `<Teleport>` with client-side and server-side rendering.
+
+::alert{type=info icon=👉}
+Learn more about [teleports](/docs/usage/teleports).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/app/teleport" file="app.vue"}
diff --git a/docs/content/4.examples/2.auto-imports/components.md b/docs/content/4.examples/2.auto-imports/components.md
new file mode 100644
index 00000000000..43d7c9e8115
--- /dev/null
+++ b/docs/content/4.examples/2.auto-imports/components.md
@@ -0,0 +1,14 @@
+---
+template: Example
+---
+
+# Components
+
+Components in the `components/` directory are auto imported and can be directly used in your templates.
+You can configure other directories to support components auto-imports.
+
+::alert{type=info icon=👉}
+Read more about [the components directory](/docs/directory-structure/components).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/auto-imports/components" file="app.vue"}
diff --git a/docs/content/4.examples/2.auto-imports/composables.md b/docs/content/4.examples/2.auto-imports/composables.md
new file mode 100644
index 00000000000..7dfa050ecf0
--- /dev/null
+++ b/docs/content/4.examples/2.auto-imports/composables.md
@@ -0,0 +1,14 @@
+---
+template: Example
+---
+
+# Composables
+
+This example shows how to use the `composables/` directory to auto import composables.
+If the component file provides a default export, the name of the composable will be mapped to the name of the file. Named exports can be used as-is.
+
+::alert{type=info icon=👉}
+Read more about [the composables directory](/docs/directory-structure/composables).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/auto-imports/composables" file="app.vue"}
diff --git a/docs/content/4.examples/3.composables/use-async-data.md b/docs/content/4.examples/3.composables/use-async-data.md
new file mode 100644
index 00000000000..e5fe6becfa3
--- /dev/null
+++ b/docs/content/4.examples/3.composables/use-async-data.md
@@ -0,0 +1,17 @@
+---
+template: Example
+---
+
+# useAsyncData
+
+This example shows how to use `useAsyncData` to fetch data from an API endpoint.
+
+::alert{type=info icon=💡}
+Nuxt will automatically read files in the ~/server/api directory to create API endpoints.
+::
+
+::alert{type=info icon=👉}
+Learn more about [data fetching](/docs/usage/data-fetching).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/composables/use-async-data" file="app.vue"}
diff --git a/docs/content/4.examples/3.composables/use-cookie.md b/docs/content/4.examples/3.composables/use-cookie.md
new file mode 100644
index 00000000000..bd71e424218
--- /dev/null
+++ b/docs/content/4.examples/3.composables/use-cookie.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# useCookie
+
+This example shows how to use the `useCookie` API to persist small amounts of data that both client-side and server-side can use.
+
+::alert{type=info icon=👉}
+Learn more about [useCookie](/docs/usage/cookies).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/composables/use-cookie" file="app.vue"}
diff --git a/docs/content/4.examples/3.composables/use-fetch.md b/docs/content/4.examples/3.composables/use-fetch.md
new file mode 100644
index 00000000000..05ab182db90
--- /dev/null
+++ b/docs/content/4.examples/3.composables/use-fetch.md
@@ -0,0 +1,17 @@
+---
+template: Example
+---
+
+# useFetch
+
+This example shows how to use `useFetch` to fetch data from an API endpoint.
+
+::alert{type=info icon=💡}
+Nuxt will automatically read files in the ~/server/api directory to create API endpoints.
+::
+
+::alert{type=info icon=👉}
+Learn more about [data fetching](/docs/usage/data-fetching).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/composables/use-fetch" file="app.vue"}
diff --git a/docs/content/4.examples/3.composables/use-meta.md b/docs/content/4.examples/3.composables/use-meta.md
new file mode 100644
index 00000000000..b910efab732
--- /dev/null
+++ b/docs/content/4.examples/3.composables/use-meta.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# useMeta
+
+This example shows how to use `useMeta` and Nuxt built-in components to bind meta data to the head of the page.
+
+::alert{type=info icon=👉}
+Learn more about [meta tags](/docs/usage/meta-tags).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/composables/use-meta" file="app.vue"}
diff --git a/docs/content/4.examples/3.composables/use-state.md b/docs/content/4.examples/3.composables/use-state.md
new file mode 100644
index 00000000000..524a2fe73a1
--- /dev/null
+++ b/docs/content/4.examples/3.composables/use-state.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# useState
+
+`useState` is an SSR-friendly ref replacement. Its value will be preserved after server-side rendering and shared across all components using a unique key.
+
+::alert{type=info icon=👉}
+Learn more about [useState](/docs/usage/state).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/composables/use-state" file="app.vue"}
diff --git a/docs/content/4.examples/4.routing/layouts.md b/docs/content/4.examples/4.routing/layouts.md
new file mode 100644
index 00000000000..309aba9486d
--- /dev/null
+++ b/docs/content/4.examples/4.routing/layouts.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Layouts
+
+This example shows how to define default and custom layouts.
+
+::alert{type=info icon=👉}
+Learn more about [layouts](/docs/directory-structure/layouts).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/routing/layouts" file="pages/index.vue"}
diff --git a/docs/content/4.examples/4.routing/middleware.md b/docs/content/4.examples/4.routing/middleware.md
new file mode 100644
index 00000000000..a867f19c671
--- /dev/null
+++ b/docs/content/4.examples/4.routing/middleware.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Middleware
+
+This example shows how to add route middleware with the middleware/ directory or with a plugin, and how to use them globally or per page.
+
+::alert{type=info icon=👉}
+Learn more about [middleware](/docs/directory-structure/middleware).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/routing/middleware" file="app.vue"}
diff --git a/docs/content/4.examples/4.routing/nuxt-link.md b/docs/content/4.examples/4.routing/nuxt-link.md
new file mode 100644
index 00000000000..8be8cd7ae53
--- /dev/null
+++ b/docs/content/4.examples/4.routing/nuxt-link.md
@@ -0,0 +1,17 @@
+---
+template: Example
+---
+
+# NuxtLink
+
+This example shows different ways to use Nuxtlink.
+
+::alert{type=info icon=💡}
+`components/myNuxtLink.js` defines a custom NuxtLink.
+::
+
+::alert{type=info icon=👉}
+Learn more about [NuxtLink](/docs/usage/nuxt-link).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/routing/nuxt-link" file="app.vue"}
diff --git a/docs/content/4.examples/4.routing/pages.md b/docs/content/4.examples/4.routing/pages.md
new file mode 100644
index 00000000000..96d3f63d893
--- /dev/null
+++ b/docs/content/4.examples/4.routing/pages.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Pages
+
+This example shows how to use the `pages/` directory to create application routes.
+
+::alert{type=info icon=👉}
+Learn more about [pages](/docs/directory-structure/pages).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/routing/pages" file="app.vue"}
diff --git a/docs/content/4.examples/4.routing/universal-router.md b/docs/content/4.examples/4.routing/universal-router.md
new file mode 100644
index 00000000000..f52df483701
--- /dev/null
+++ b/docs/content/4.examples/4.routing/universal-router.md
@@ -0,0 +1,9 @@
+---
+template: Example
+---
+
+# Universal Router
+
+This example demonstrates Nuxt universal routing utilities without depending on `pages/` and `vue-router`.
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/routing/universal-router" file="app.vue"}
diff --git a/docs/content/4.examples/5.advanced/config-extends.md b/docs/content/4.examples/5.advanced/config-extends.md
new file mode 100644
index 00000000000..44e12bdfb73
--- /dev/null
+++ b/docs/content/4.examples/5.advanced/config-extends.md
@@ -0,0 +1,9 @@
+---
+template: Example
+---
+
+# Config extends
+
+This example shows how to use the `extends` key in nuxt.config.ts to use the base/ directory as a base Nuxt application, and use its components, composables or config and override them if necessary.
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/advanced/config-extends" file="nuxt.config.ts"}
diff --git a/docs/content/4.examples/5.advanced/module-extend-pages.md b/docs/content/4.examples/5.advanced/module-extend-pages.md
new file mode 100644
index 00000000000..c34fd92af3c
--- /dev/null
+++ b/docs/content/4.examples/5.advanced/module-extend-pages.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Module Extend pages
+
+This example defines a new `test` page using `extendPages` within a module.
+
+::alert{type=info icon=👉}
+Learn more about [modules creation](/docs/advanced/modules).
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/advanced/module-extend-pages" file="pages/index.vue"}
diff --git a/docs/content/4.examples/5.advanced/test.md b/docs/content/4.examples/5.advanced/test.md
new file mode 100644
index 00000000000..fdf30782073
--- /dev/null
+++ b/docs/content/4.examples/5.advanced/test.md
@@ -0,0 +1,7 @@
+---
+template: Example
+---
+
+# Test
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/advanced/test" file="app.vue"}
diff --git a/docs/content/4.examples/6.experimental/reactivity-transform.md b/docs/content/4.examples/6.experimental/reactivity-transform.md
new file mode 100644
index 00000000000..888b6c4f871
--- /dev/null
+++ b/docs/content/4.examples/6.experimental/reactivity-transform.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Reactivity Transform
+
+This example demonstrates the support of Reactivity transform in Nuxt 3.
+
+::alert{type=info icon=👉}
+Learn more about [Reactivity transform](https://vuejs.org/guide/extras/reactivity-transform.html) on the Vue docs.
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/experimental/reactivity-transform" file="app.vue"}
diff --git a/docs/content/4.examples/6.experimental/wasm.md b/docs/content/4.examples/6.experimental/wasm.md
new file mode 100644
index 00000000000..6dd502905a5
--- /dev/null
+++ b/docs/content/4.examples/6.experimental/wasm.md
@@ -0,0 +1,9 @@
+---
+template: Example
+---
+
+# Wasm
+
+This example demonstrates the server-side support of WebAssembly in Nuxt 3.
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/experimental/wasm" file="app.vue"}
diff --git a/docs/content/4.examples/7.other/locale.md b/docs/content/4.examples/7.other/locale.md
new file mode 100644
index 00000000000..01c37c2dce6
--- /dev/null
+++ b/docs/content/4.examples/7.other/locale.md
@@ -0,0 +1,13 @@
+---
+template: Example
+---
+
+# Locale
+
+This example shows how to define a locale composable to handle the application's locale, both server and client-side.
+
+::alert{type=info icon=💡}
+You can right click to "View Page Source" and see that Nuxt renders the correct date in SSR based on visitor's locale.
+::
+
+::sandbox{repo="nuxt/framework" branch="main" dir="examples/other/locale" file="app.vue"}
diff --git a/docs/content/4.examples/index.md b/docs/content/4.examples/index.md
new file mode 100644
index 00000000000..acf6d0c78ac
--- /dev/null
+++ b/docs/content/4.examples/index.md
@@ -0,0 +1,9 @@
+---
+title: Examples
+layout.aside: true
+layout.fluid: true
+navigation:
+  exclusive: true
+  collapse: true
+  redirect: /examples/essentials/hello-world
+---
diff --git a/docs/content/4.community/1.getting-help.md b/docs/content/5.community/1.getting-help.md
similarity index 100%
rename from docs/content/4.community/1.getting-help.md
rename to docs/content/5.community/1.getting-help.md
diff --git a/docs/content/4.community/2.reporting-bugs.md b/docs/content/5.community/2.reporting-bugs.md
similarity index 100%
rename from docs/content/4.community/2.reporting-bugs.md
rename to docs/content/5.community/2.reporting-bugs.md
diff --git a/docs/content/4.community/3.contribution.md b/docs/content/5.community/3.contribution.md
similarity index 100%
rename from docs/content/4.community/3.contribution.md
rename to docs/content/5.community/3.contribution.md
diff --git a/docs/content/4.community/4.roadmap.md b/docs/content/5.community/4.roadmap.md
similarity index 91%
rename from docs/content/4.community/4.roadmap.md
rename to docs/content/5.community/4.roadmap.md
index 45b5fe8acbf..f818fb53524 100644
--- a/docs/content/4.community/4.roadmap.md
+++ b/docs/content/5.community/4.roadmap.md
@@ -6,14 +6,15 @@ Nuxt is constantly evolving, with new features and modules being added all the t
 
 - [Nuxt 3 Beta](https://nuxtjs.org/announcements/nuxt3-beta/)
 - [Nuxt 3 Release Candidate](https://github.com/nuxt/framework/discussions/3447)
+- [Nuxt 3 Migration Guide](https://github.com/nuxt/framework/discussions/3989)
 
 ## 📅 Release schedule
 
-Release             | Expected date | Description
---------------------|---------------|---------------------------------------------------
-`nuxt@3.0.0-rc.1`   | March 2022    | Nuxt v3 first release candidate
-`nuxt@2.16`         | March 2022    | Nuxt v2 cumulative updates for future compatibility
-`nuxt@3.0.0`        | June  2022    | Nuxt v3 stable release
+Release             | Expected date   | Description
+--------------------|-----------------|---------------------------------------------------
+`nuxt@3.0.0-rc.1`   | April 7, 2022   | Nuxt v3 first release candidate
+`nuxt@2.16`         | April,   2022   | Nuxt v2 cumulative updates for future compatibility
+`nuxt@3.0.0`        | June    2022    | Nuxt v3 stable release
 
 ### Current Releases
 
diff --git a/docs/content/4.community/index.md b/docs/content/5.community/index.md
similarity index 100%
rename from docs/content/4.community/index.md
rename to docs/content/5.community/index.md
diff --git a/docs/content/_collections/header.md b/docs/content/_collections/header.md
index ce34c8f6b10..69ad9598b0f 100644
--- a/docs/content/_collections/header.md
+++ b/docs/content/_collections/header.md
@@ -9,6 +9,9 @@ links:
   -
     title: 'Docs'
     to: '/docs/usage/data-fetching'
+  -
+    title: 'Examples'
+    to: '/examples/essentials/hello-world'
   -
     title: 'Community'
     to: '/community/getting-help'
diff --git a/docs/content/index.md b/docs/content/index.md
index 88db430571e..1cd57373a93 100644
--- a/docs/content/index.md
+++ b/docs/content/index.md
@@ -96,7 +96,7 @@ Nuxt 3 has been re-architected with a smaller core and optimized for faster perf
   ::section-content-item
   ---
   title: Nuxt Kit
-  description: 'Brand new module development with Typescript and cross-version compatibility.'
+  description: 'Brand new module development with TypeScript and cross-version compatibility.'
   image: IconKit
   imageClass: w-10 h-10
   ---
diff --git a/docs/package.json b/docs/package.json
index 1a4aa02d38c..b2e27906879 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -18,11 +18,11 @@
     "pathe": "^0.2.0",
     "rimraf": "^3.0.2",
     "scule": "^0.2.1",
-    "untyped": "^0.4.3",
+    "untyped": "^0.4.4",
     "vue-mq": "^1.0.1",
     "vue-plausible": "^1.3.1"
   },
   "dependencies": {
-    "three": "^0.139.0"
+    "three": "^0.139.2"
   }
 }
diff --git a/docs/yarn.lock b/docs/yarn.lock
index c8729683a8c..9e7f1a7ba20 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -10837,10 +10837,10 @@ thread-loader@^3.0.4:
     neo-async "^2.6.2"
     schema-utils "^3.0.0"
 
-three@^0.139.0:
-  version "0.139.0"
-  resolved "https://registry.yarnpkg.com/three/-/three-0.139.0.tgz#4805eeb4cde85d8a82b6048088230f8ce5b75375"
-  integrity sha512-hZ4LkCjgoEM82WLaOVptDKGpB3SkEyuJP2OHe36AFO8hS2I6CrEiNanXj7wwR3wIPT7V5wi5Y5pFnncS5SVHgQ==
+three@^0.139.2:
+  version "0.139.2"
+  resolved "https://registry.yarnpkg.com/three/-/three-0.139.2.tgz#b110799a15736df673b9293e31653a4ac73648dd"
+  integrity sha512-gV7q7QY8rogu7HLFZR9cWnOQAUedUhu2WXAnpr2kdXZP9YDKsG/0ychwQvWkZN5PlNw9mv5MoCTin6zNTXoONg==
 
 through2@^2.0.0:
   version "2.0.5"
@@ -11389,10 +11389,10 @@ untyped@^0.2.5, untyped@^0.2.8, untyped@^0.2.9:
   resolved "https://registry.yarnpkg.com/untyped/-/untyped-0.2.9.tgz#3e3df96a303dec3e2eda55fcbdc02e2ab468683d"
   integrity sha512-8d8V+q/y5CGzV+IYnoOCMjrK+NSNp1HKO8iPQ+bV4rBP8knPIme3+j/bpej8IuMnEMxOJZNptXNOXCx7w+VJxQ==
 
-untyped@^0.4.3:
-  version "0.4.3"
-  resolved "https://registry.yarnpkg.com/untyped/-/untyped-0.4.3.tgz#284011a22b79787e050b3692e17fdffcaa41860e"
-  integrity sha512-IFlE2be3vW69rLjdkmj5pa/JK/rAzbvFyJZfs+63QX/RN+jgx2CQUZckhTxNsV2H/JSXfc7NEqpX8tLoI2+eOg==
+untyped@^0.4.4:
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/untyped/-/untyped-0.4.4.tgz#a3043588892266c9176e7049799a65aaa9e4db4b"
+  integrity sha512-sY6u8RedwfLfBis0copfU/fzROieyAndqPs8Kn2PfyzTjtA88vCk81J1b5z+8/VJc+cwfGy23/AqOCpvAbkNVw==
   dependencies:
     "@babel/core" "^7.17.7"
     "@babel/standalone" "^7.17.7"
diff --git a/examples/README.md b/examples/README.md
index cd0f41be6b6..025e64a94ea 100644
--- a/examples/README.md
+++ b/examples/README.md
@@ -10,10 +10,10 @@
 | `use-fetch` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/use-fetch) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/use-fetch?file=app.vue&terminal=dev) |
 | `use-meta` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/use-meta) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/use-meta?file=app.vue&terminal=dev) |
 | `use-state` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/use-state) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/use-state?file=app.vue&terminal=dev) |
-| `with-components` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/with-components) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/with-components?file=app.vue&terminal=dev) |
-| `with-composables` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/with-composables) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/with-composables?file=app.vue&terminal=dev) |
-| `with-layouts` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/with-layouts) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/with-layouts?file=app.vue&terminal=dev) |
-| `with-pages` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/with-pages) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/with-pages?file=app.vue&terminal=dev) |
-| `with-plugins` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/with-plugins) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/with-plugins?file=app.vue&terminal=dev) |
-| `with-universal-router` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/with-universal-router) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/with-universal-router?file=app.vue&terminal=dev) |
-| `with-wasm` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/with-wasm) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/with-wasm?file=app.vue&terminal=dev) |
+| `components` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/components) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/components?file=app.vue&terminal=dev) |
+| `composables` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/composables) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/composables?file=app.vue&terminal=dev) |
+| `layouts` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/layouts) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/layouts?file=app.vue&terminal=dev) |
+| `pages` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/pages) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/pages?file=app.vue&terminal=dev) |
+| `plugins` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/plugins) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/plugins?file=app.vue&terminal=dev) |
+| `universal-router` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/universal-router) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/universal-router?file=app.vue&terminal=dev) |
+| `wasm` | [GitHub](https://github.com/nuxt/framework/tree/main/examples/wasm) | [Play Online](https://stackblitz.com/github/nuxt/framework/tree/main/examples/wasm?file=app.vue&terminal=dev) |
diff --git a/examples/config-extends/base/components/BaseButton.vue b/examples/advanced/config-extends/base/components/BaseButton.vue
similarity index 100%
rename from examples/config-extends/base/components/BaseButton.vue
rename to examples/advanced/config-extends/base/components/BaseButton.vue
diff --git a/examples/config-extends/base/components/FancyButton.vue b/examples/advanced/config-extends/base/components/FancyButton.vue
similarity index 100%
rename from examples/config-extends/base/components/FancyButton.vue
rename to examples/advanced/config-extends/base/components/FancyButton.vue
diff --git a/examples/config-extends/base/composables/foo.ts b/examples/advanced/config-extends/base/composables/foo.ts
similarity index 100%
rename from examples/config-extends/base/composables/foo.ts
rename to examples/advanced/config-extends/base/composables/foo.ts
diff --git a/examples/config-extends/base/middleware/foo.ts b/examples/advanced/config-extends/base/middleware/foo.ts
similarity index 100%
rename from examples/config-extends/base/middleware/foo.ts
rename to examples/advanced/config-extends/base/middleware/foo.ts
diff --git a/examples/config-extends/base/nuxt.config.ts b/examples/advanced/config-extends/base/nuxt.config.ts
similarity index 100%
rename from examples/config-extends/base/nuxt.config.ts
rename to examples/advanced/config-extends/base/nuxt.config.ts
diff --git a/examples/config-extends/base/pages/foo.vue b/examples/advanced/config-extends/base/pages/foo.vue
similarity index 100%
rename from examples/config-extends/base/pages/foo.vue
rename to examples/advanced/config-extends/base/pages/foo.vue
diff --git a/examples/config-extends/base/plugins/my-plugin.ts b/examples/advanced/config-extends/base/plugins/my-plugin.ts
similarity index 100%
rename from examples/config-extends/base/plugins/my-plugin.ts
rename to examples/advanced/config-extends/base/plugins/my-plugin.ts
diff --git a/examples/config-extends/base/server/api/base.ts b/examples/advanced/config-extends/base/server/api/base.ts
similarity index 100%
rename from examples/config-extends/base/server/api/base.ts
rename to examples/advanced/config-extends/base/server/api/base.ts
diff --git a/examples/config-extends/base/utils/bar.ts b/examples/advanced/config-extends/base/utils/bar.ts
similarity index 100%
rename from examples/config-extends/base/utils/bar.ts
rename to examples/advanced/config-extends/base/utils/bar.ts
diff --git a/examples/config-extends/components/FancyButton.vue b/examples/advanced/config-extends/components/FancyButton.vue
similarity index 100%
rename from examples/config-extends/components/FancyButton.vue
rename to examples/advanced/config-extends/components/FancyButton.vue
diff --git a/examples/config-extends/nuxt.config.ts b/examples/advanced/config-extends/nuxt.config.ts
similarity index 100%
rename from examples/config-extends/nuxt.config.ts
rename to examples/advanced/config-extends/nuxt.config.ts
diff --git a/examples/config-extends/package.json b/examples/advanced/config-extends/package.json
similarity index 100%
rename from examples/config-extends/package.json
rename to examples/advanced/config-extends/package.json
diff --git a/examples/config-extends/pages/index.vue b/examples/advanced/config-extends/pages/index.vue
similarity index 57%
rename from examples/config-extends/pages/index.vue
rename to examples/advanced/config-extends/pages/index.vue
index 75814a417ef..549b1d0dc59 100644
--- a/examples/config-extends/pages/index.vue
+++ b/examples/advanced/config-extends/pages/index.vue
@@ -5,7 +5,7 @@ const bar = getBar()
 </script>
 
 <template>
-  <NuxtExampleLayout show-tips example="config-extends">
+  <NuxtExampleLayout example="advanced/config-extends">
     theme runtimeConfig
     <pre>{{ JSON.stringify(themeConfig, null, 2) }}</pre>
     <BaseButton>Base Button</BaseButton>
@@ -15,11 +15,6 @@ const bar = getBar()
     {{ foo }} {{ bar }}
     <br>
     {{ $myPlugin() }}
-    <template #tips>
-      <p>
-        This example shows how to use the <code>extends</code> key in <code>nuxt.config.ts</code> to use the <code>base/</code> directory as a base Nuxt application, and use its components, composable or config and override them if necessary.
-      </p>
-    </template>
   </NuxtExampleLayout>
 </template>
 
diff --git a/examples/config-extends/server/api/hello.ts b/examples/advanced/config-extends/server/api/hello.ts
similarity index 100%
rename from examples/config-extends/server/api/hello.ts
rename to examples/advanced/config-extends/server/api/hello.ts
diff --git a/examples/config-extends/tsconfig.json b/examples/advanced/config-extends/tsconfig.json
similarity index 100%
rename from examples/config-extends/tsconfig.json
rename to examples/advanced/config-extends/tsconfig.json
diff --git a/examples/config-extends/ui/components/Button.vue b/examples/advanced/config-extends/ui/components/Button.vue
similarity index 100%
rename from examples/config-extends/ui/components/Button.vue
rename to examples/advanced/config-extends/ui/components/Button.vue
diff --git a/examples/config-extends/ui/nuxt.config.ts b/examples/advanced/config-extends/ui/nuxt.config.ts
similarity index 100%
rename from examples/config-extends/ui/nuxt.config.ts
rename to examples/advanced/config-extends/ui/nuxt.config.ts
diff --git a/examples/advanced/module-extend-pages/layouts/default.vue b/examples/advanced/module-extend-pages/layouts/default.vue
new file mode 100644
index 00000000000..b1a49db13c6
--- /dev/null
+++ b/examples/advanced/module-extend-pages/layouts/default.vue
@@ -0,0 +1,5 @@
+<template>
+  <NuxtExampleLayout example="advanced/module-extend-pages">
+    <slot />
+  </NuxtExampleLayout>
+</template>
diff --git a/examples/module-extend-pages/modules/pages/index.ts b/examples/advanced/module-extend-pages/modules/pages/index.ts
similarity index 100%
rename from examples/module-extend-pages/modules/pages/index.ts
rename to examples/advanced/module-extend-pages/modules/pages/index.ts
diff --git a/examples/module-extend-pages/modules/pages/pages/test.vue b/examples/advanced/module-extend-pages/modules/pages/pages/test.vue
similarity index 100%
rename from examples/module-extend-pages/modules/pages/pages/test.vue
rename to examples/advanced/module-extend-pages/modules/pages/pages/test.vue
diff --git a/examples/module-extend-pages/nuxt.config.ts b/examples/advanced/module-extend-pages/nuxt.config.ts
similarity index 100%
rename from examples/module-extend-pages/nuxt.config.ts
rename to examples/advanced/module-extend-pages/nuxt.config.ts
diff --git a/examples/module-extend-pages/package.json b/examples/advanced/module-extend-pages/package.json
similarity index 100%
rename from examples/module-extend-pages/package.json
rename to examples/advanced/module-extend-pages/package.json
diff --git a/examples/module-extend-pages/pages/index.vue b/examples/advanced/module-extend-pages/pages/index.vue
similarity index 100%
rename from examples/module-extend-pages/pages/index.vue
rename to examples/advanced/module-extend-pages/pages/index.vue
diff --git a/examples/hello-world/tsconfig.json b/examples/advanced/module-extend-pages/tsconfig.json
similarity index 100%
rename from examples/hello-world/tsconfig.json
rename to examples/advanced/module-extend-pages/tsconfig.json
diff --git a/examples/with-test/app.vue b/examples/advanced/test/app.vue
similarity index 100%
rename from examples/with-test/app.vue
rename to examples/advanced/test/app.vue
diff --git a/examples/hello-world/nuxt.config.ts b/examples/advanced/test/nuxt.config.ts
similarity index 100%
rename from examples/hello-world/nuxt.config.ts
rename to examples/advanced/test/nuxt.config.ts
diff --git a/examples/with-test/package.json b/examples/advanced/test/package.json
similarity index 84%
rename from examples/with-test/package.json
rename to examples/advanced/test/package.json
index cb24fd93641..50a91c5b67f 100644
--- a/examples/with-test/package.json
+++ b/examples/advanced/test/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "example-with-test",
+  "name": "example-test",
   "private": true,
   "scripts": {
     "build": "nuxi build",
diff --git a/examples/with-test/tests/basic.test.ts b/examples/advanced/test/tests/basic.test.ts
similarity index 100%
rename from examples/with-test/tests/basic.test.ts
rename to examples/advanced/test/tests/basic.test.ts
diff --git a/examples/locale/tsconfig.json b/examples/advanced/test/tsconfig.json
similarity index 100%
rename from examples/locale/tsconfig.json
rename to examples/advanced/test/tsconfig.json
diff --git a/examples/with-errors/app.vue b/examples/app/error-handling/app.vue
similarity index 76%
rename from examples/with-errors/app.vue
rename to examples/app/error-handling/app.vue
index c1b3b30102e..66f9ee9c715 100644
--- a/examples/with-errors/app.vue
+++ b/examples/app/error-handling/app.vue
@@ -15,7 +15,7 @@ function triggerError () {
 </script>
 
 <template>
-  <NuxtExampleLayout show-tips example="with-errors">
+  <NuxtExampleLayout example="app/error-handling">
     <template #nav>
       <nav class="flex align-center gap-4 p-4">
         <NuxtLink to="/" class="n-link-base">
@@ -44,13 +44,5 @@ function triggerError () {
         Current route: <code>{{ route.path }}</code>
       </div>
     </template>
-    <template #tips>
-      <div>
-        <p>This example shows how to handle errors in different contexts: pages, plugins, components and middleware.</p>
-        <a href="https://v3.nuxtjs.org/docs/usage/error-handling" target="_blank">
-          Read more about error handling
-        </a>
-      </div>
-    </template>
   </NuxtExampleLayout>
 </template>
diff --git a/examples/with-errors/components/FaultyComponent.vue b/examples/app/error-handling/components/FaultyComponent.vue
similarity index 100%
rename from examples/with-errors/components/FaultyComponent.vue
rename to examples/app/error-handling/components/FaultyComponent.vue
diff --git a/examples/with-errors/components/ThrowError.vue b/examples/app/error-handling/components/ThrowError.vue
similarity index 100%
rename from examples/with-errors/components/ThrowError.vue
rename to examples/app/error-handling/components/ThrowError.vue
diff --git a/examples/with-errors/error.vue b/examples/app/error-handling/error.vue
similarity index 100%
rename from examples/with-errors/error.vue
rename to examples/app/error-handling/error.vue
diff --git a/examples/with-errors/middleware/error.global.ts b/examples/app/error-handling/middleware/error.global.ts
similarity index 100%
rename from examples/with-errors/middleware/error.global.ts
rename to examples/app/error-handling/middleware/error.global.ts
diff --git a/examples/locale/nuxt.config.ts b/examples/app/error-handling/nuxt.config.ts
similarity index 100%
rename from examples/locale/nuxt.config.ts
rename to examples/app/error-handling/nuxt.config.ts
diff --git a/examples/app/error-handling/package.json b/examples/app/error-handling/package.json
new file mode 100644
index 00000000000..54dec6d7248
--- /dev/null
+++ b/examples/app/error-handling/package.json
@@ -0,0 +1,13 @@
+{
+  "name": "example-error-handling",
+  "private": true,
+  "scripts": {
+    "build": "nuxi build",
+    "dev": "nuxi dev",
+    "start": "nuxi preview"
+  },
+  "devDependencies": {
+    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
+    "nuxt3": "latest"
+  }
+}
diff --git a/examples/with-errors/pages/index.vue b/examples/app/error-handling/pages/index.vue
similarity index 100%
rename from examples/with-errors/pages/index.vue
rename to examples/app/error-handling/pages/index.vue
diff --git a/examples/with-errors/pages/other.vue b/examples/app/error-handling/pages/other.vue
similarity index 100%
rename from examples/with-errors/pages/other.vue
rename to examples/app/error-handling/pages/other.vue
diff --git a/examples/with-errors/plugins/error.ts b/examples/app/error-handling/plugins/error.ts
similarity index 100%
rename from examples/with-errors/plugins/error.ts
rename to examples/app/error-handling/plugins/error.ts
diff --git a/examples/with-errors/server/middleware/error.ts b/examples/app/error-handling/server/middleware/error.ts
similarity index 100%
rename from examples/with-errors/server/middleware/error.ts
rename to examples/app/error-handling/server/middleware/error.ts
diff --git a/examples/module-extend-pages/tsconfig.json b/examples/app/error-handling/tsconfig.json
similarity index 100%
rename from examples/module-extend-pages/tsconfig.json
rename to examples/app/error-handling/tsconfig.json
diff --git a/examples/app/plugins/app.vue b/examples/app/plugins/app.vue
new file mode 100644
index 00000000000..37142ca1c1e
--- /dev/null
+++ b/examples/app/plugins/app.vue
@@ -0,0 +1,5 @@
+<template>
+  <NuxtExampleLayout example="app/plugins">
+    <div>{{ $myPlugin() }}</div>
+  </NuxtExampleLayout>
+</template>
diff --git a/examples/nuxt-link/nuxt.config.ts b/examples/app/plugins/nuxt.config.ts
similarity index 100%
rename from examples/nuxt-link/nuxt.config.ts
rename to examples/app/plugins/nuxt.config.ts
diff --git a/examples/with-pages/package.json b/examples/app/plugins/package.json
similarity index 86%
rename from examples/with-pages/package.json
rename to examples/app/plugins/package.json
index fa321597dbd..237df6f08ae 100644
--- a/examples/with-pages/package.json
+++ b/examples/app/plugins/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "example-with-pages",
+  "name": "example-plugins",
   "private": true,
   "scripts": {
     "build": "nuxi build",
diff --git a/examples/with-plugins/plugins/my-plugin.ts b/examples/app/plugins/plugins/my-plugin.ts
similarity index 100%
rename from examples/with-plugins/plugins/my-plugin.ts
rename to examples/app/plugins/plugins/my-plugin.ts
diff --git a/examples/nuxt-link/tsconfig.json b/examples/app/plugins/tsconfig.json
similarity index 100%
rename from examples/nuxt-link/tsconfig.json
rename to examples/app/plugins/tsconfig.json
diff --git a/examples/app/teleport/app.vue b/examples/app/teleport/app.vue
new file mode 100644
index 00000000000..bc3f9b99661
--- /dev/null
+++ b/examples/app/teleport/app.vue
@@ -0,0 +1,22 @@
+<template>
+  <NuxtExampleLayout example="app/teleport">
+    <div>
+      <!-- SSR Teleport -->
+      <Teleport to="body">
+        SSR Teleport
+      </Teleport>
+
+      <!-- Client Teleport -->
+      <ClientOnly>
+        <Teleport to="body">
+          <div>
+            Hello from a client-side teleport!
+          </div>
+        </Teleport>
+      </ClientOnly>
+
+      <!-- Modal Example -->
+      <MyModal />
+    </div>
+  </NuxtExampleLayout>
+</template>
diff --git a/examples/app/teleport/components/MyModal.vue b/examples/app/teleport/components/MyModal.vue
new file mode 100644
index 00000000000..804c2b18f0f
--- /dev/null
+++ b/examples/app/teleport/components/MyModal.vue
@@ -0,0 +1,34 @@
+<script>
+export default {
+  data () {
+    return {
+      open: false
+    }
+  }
+}
+</script>
+
+<template>
+  <NButton @click="open = true">
+    Open Modal
+  </NButton>
+  <Teleport to="body">
+    <NCard v-if="open" class="modal p4">
+      <p>Hello from the modal!</p>
+      <NButton @click="open = false">
+        Close
+      </NButton>
+    </NCard>
+  </Teleport>
+</template>
+
+<style scoped>
+.modal {
+  position: fixed;
+  z-index: 999;
+  top: 20%;
+  left: 50%;
+  width: 300px;
+  margin-left: -150px;
+}
+</style>
diff --git a/examples/use-async-data/nuxt.config.ts b/examples/app/teleport/nuxt.config.ts
similarity index 100%
rename from examples/use-async-data/nuxt.config.ts
rename to examples/app/teleport/nuxt.config.ts
diff --git a/examples/with-errors/package.json b/examples/app/teleport/package.json
similarity index 86%
rename from examples/with-errors/package.json
rename to examples/app/teleport/package.json
index e73ff53ed45..0e7a8c4f2e8 100644
--- a/examples/with-errors/package.json
+++ b/examples/app/teleport/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "example-with-errors",
+  "name": "example-teleport",
   "private": true,
   "scripts": {
     "build": "nuxi build",
diff --git a/examples/use-async-data/tsconfig.json b/examples/app/teleport/tsconfig.json
similarity index 100%
rename from examples/use-async-data/tsconfig.json
rename to examples/app/teleport/tsconfig.json
diff --git a/examples/auto-imports/components/app.vue b/examples/auto-imports/components/app.vue
new file mode 100644
index 00000000000..fe3d0609507
--- /dev/null
+++ b/examples/auto-imports/components/app.vue
@@ -0,0 +1,14 @@
+<template>
+  <NuxtExampleLayout example="auto-imports/components">
+    <h1 class="text-xl opacity-50">
+      Auto Imported Components
+    </h1>
+    <div>
+      <!-- Auto Imported Components -->
+      <HelloWorld class="text-2xl" />
+      <Nuxt3 class="text-2xl" />
+      <ParentFolderHello class="mt-6" />
+      <NuxtWithPrefix class="mt-6" />
+    </div>
+  </NuxtExampleLayout>
+</template>
diff --git a/examples/with-components/components/HelloWorld.vue b/examples/auto-imports/components/components/HelloWorld.vue
similarity index 100%
rename from examples/with-components/components/HelloWorld.vue
rename to examples/auto-imports/components/components/HelloWorld.vue
diff --git a/examples/with-components/components/Nuxt3.vue b/examples/auto-imports/components/components/Nuxt3.vue
similarity index 100%
rename from examples/with-components/components/Nuxt3.vue
rename to examples/auto-imports/components/components/Nuxt3.vue
diff --git a/examples/with-components/components/parent-folder/Hello.vue b/examples/auto-imports/components/components/parent-folder/Hello.vue
similarity index 100%
rename from examples/with-components/components/parent-folder/Hello.vue
rename to examples/auto-imports/components/components/parent-folder/Hello.vue
diff --git a/examples/with-components/nuxt.config.ts b/examples/auto-imports/components/nuxt.config.ts
similarity index 100%
rename from examples/with-components/nuxt.config.ts
rename to examples/auto-imports/components/nuxt.config.ts
diff --git a/examples/with-components/other-components-folder/with-prefix.vue b/examples/auto-imports/components/other-components-folder/with-prefix.vue
similarity index 100%
rename from examples/with-components/other-components-folder/with-prefix.vue
rename to examples/auto-imports/components/other-components-folder/with-prefix.vue
diff --git a/examples/with-layouts/package.json b/examples/auto-imports/components/package.json
similarity index 86%
rename from examples/with-layouts/package.json
rename to examples/auto-imports/components/package.json
index 4bd41fa5468..1a0664af9a3 100644
--- a/examples/with-layouts/package.json
+++ b/examples/auto-imports/components/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "example-with-layouts",
+  "name": "example-components",
   "private": true,
   "scripts": {
     "build": "nuxi build",
diff --git a/examples/use-cookie/tsconfig.json b/examples/auto-imports/components/tsconfig.json
similarity index 100%
rename from examples/use-cookie/tsconfig.json
rename to examples/auto-imports/components/tsconfig.json
diff --git a/examples/auto-imports/composables/app.vue b/examples/auto-imports/composables/app.vue
new file mode 100644
index 00000000000..debf44b1bf3
--- /dev/null
+++ b/examples/auto-imports/composables/app.vue
@@ -0,0 +1,17 @@
+<template>
+  <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>
+    <p>Named export <code>useD</code> : {{ d }}</p>
+    <p>Default export <code>useFoo</code> : {{ foo }}</p>
+  </NuxtExampleLayout>
+</template>
+
+<script setup>
+const a = useA()
+const b = useB()
+const c = useC()
+const d = useD()
+const foo = useFoo()
+</script>
diff --git a/examples/with-composables/composables/use-foo.ts b/examples/auto-imports/composables/composables/use-foo.ts
similarity index 100%
rename from examples/with-composables/composables/use-foo.ts
rename to examples/auto-imports/composables/composables/use-foo.ts
diff --git a/examples/use-cookie/nuxt.config.ts b/examples/auto-imports/composables/nuxt.config.ts
similarity index 100%
rename from examples/use-cookie/nuxt.config.ts
rename to examples/auto-imports/composables/nuxt.config.ts
diff --git a/examples/with-plugins/package.json b/examples/auto-imports/composables/package.json
similarity index 86%
rename from examples/with-plugins/package.json
rename to examples/auto-imports/composables/package.json
index 56c9bdc0098..56272b75225 100644
--- a/examples/with-plugins/package.json
+++ b/examples/auto-imports/composables/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "example-with-plugins",
+  "name": "example-composables",
   "private": true,
   "scripts": {
     "build": "nuxi build",
diff --git a/examples/composables/use-async-data/app.vue b/examples/composables/use-async-data/app.vue
new file mode 100644
index 00000000000..4987a0223d0
--- /dev/null
+++ b/examples/composables/use-async-data/app.vue
@@ -0,0 +1,35 @@
+<script setup>
+const showMountain = ref(false)
+
+const refreshing = ref(false)
+const refreshAll = async () => {
+  refreshing.value = true
+  try {
+    await refreshNuxtData()
+  } finally {
+    refreshing.value = false
+  }
+}
+</script>
+
+<template>
+  <NuxtExampleLayout example="composables/use-async-data">
+    <div>
+      <div class="flex justify-center gap-2">
+        <NButton @click="showMountain = !showMountain">
+          {{ showMountain ? 'Hide' : 'Show' }} Mountain
+        </NButton>
+        <NButton :disabled="refreshing" @click="refreshAll">
+          Refetch All Data
+        </NButton>
+      </div>
+
+      <div class="flex justify-center gap-2">
+        <CounterExample />
+      </div>
+      <div class="flex justify-center gap-2">
+        <MountainExample v-if="showMountain" />
+      </div>
+    </div>
+  </NuxtExampleLayout>
+</template>
diff --git a/examples/composables/use-async-data/components/CounterExample.vue b/examples/composables/use-async-data/components/CounterExample.vue
new file mode 100644
index 00000000000..7b4756d630f
--- /dev/null
+++ b/examples/composables/use-async-data/components/CounterExample.vue
@@ -0,0 +1,19 @@
+<script setup>
+const ctr = ref(0)
+const { data, pending, refresh } = await useAsyncData('/api/hello', () => $fetch(`/api/hello/${ctr.value}`), { watch: [ctr] })
+
+</script>
+
+<template>
+  <div>
+    {{ data }}
+    <div class="flex justify-center gap-2">
+      <NButton :disabled="pending" @click="ctr++">
+        +
+      </NButton>
+      <NButton :disabled="pending" @click="refresh">
+        ⟳
+      </NButton>
+    </div>
+  </div>
+</template>
diff --git a/examples/composables/use-async-data/components/MountainExample.vue b/examples/composables/use-async-data/components/MountainExample.vue
new file mode 100644
index 00000000000..9632969f99d
--- /dev/null
+++ b/examples/composables/use-async-data/components/MountainExample.vue
@@ -0,0 +1,9 @@
+<script setup>
+const { data: mountain } = await useFetch(
+  'https://api.nuxtjs.dev/mountains/mount-everest'
+)
+</script>
+
+<template>
+  <pre class="text-sm text-left overflow-auto">{{ mountain }}</pre>
+</template>
diff --git a/examples/use-fetch/nuxt.config.ts b/examples/composables/use-async-data/nuxt.config.ts
similarity index 100%
rename from examples/use-fetch/nuxt.config.ts
rename to examples/composables/use-async-data/nuxt.config.ts
diff --git a/examples/use-async-data/package.json b/examples/composables/use-async-data/package.json
similarity index 100%
rename from examples/use-async-data/package.json
rename to examples/composables/use-async-data/package.json
diff --git a/examples/use-async-data/server/api/hello.js b/examples/composables/use-async-data/server/api/hello.js
similarity index 100%
rename from examples/use-async-data/server/api/hello.js
rename to examples/composables/use-async-data/server/api/hello.js
diff --git a/examples/use-fetch/tsconfig.json b/examples/composables/use-async-data/tsconfig.json
similarity index 100%
rename from examples/use-fetch/tsconfig.json
rename to examples/composables/use-async-data/tsconfig.json
diff --git a/examples/use-cookie/app.vue b/examples/composables/use-cookie/app.vue
similarity index 74%
rename from examples/use-cookie/app.vue
rename to examples/composables/use-cookie/app.vue
index 6573306279d..e941773be74 100644
--- a/examples/use-cookie/app.vue
+++ b/examples/composables/use-cookie/app.vue
@@ -15,7 +15,7 @@ const logout = () => {
 </script>
 
 <template>
-  <NuxtExampleLayout show-tips="true" 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 }}! 👋
@@ -42,15 +42,5 @@ const logout = () => {
         </NButton>
       </div>
     </template>
-
-    <template #tips>
-      <div>
-        This demo showcases using the
-        <NuxtLink to="https://v3.nuxtjs.org/docs/usage/cookies" target="_blank">
-          useCookie
-        </NuxtLink>
-        API to persist small amounts of data that can be used both client-side and server-side.
-      </div>
-    </template>
   </NuxtExampleLayout>
 </template>
diff --git a/examples/use-meta/nuxt.config.ts b/examples/composables/use-cookie/nuxt.config.ts
similarity index 100%
rename from examples/use-meta/nuxt.config.ts
rename to examples/composables/use-cookie/nuxt.config.ts
diff --git a/examples/use-cookie/package.json b/examples/composables/use-cookie/package.json
similarity index 100%
rename from examples/use-cookie/package.json
rename to examples/composables/use-cookie/package.json
diff --git a/examples/use-meta/tsconfig.json b/examples/composables/use-cookie/tsconfig.json
similarity index 100%
rename from examples/use-meta/tsconfig.json
rename to examples/composables/use-cookie/tsconfig.json
diff --git a/examples/composables/use-fetch/app.vue b/examples/composables/use-fetch/app.vue
new file mode 100644
index 00000000000..9054d508f8a
--- /dev/null
+++ b/examples/composables/use-fetch/app.vue
@@ -0,0 +1,16 @@
+<script setup>
+const count = ref(1)
+const { data } = await useFetch(() => `/api/hello/${count.value}`, { params: { token: 123 } })
+</script>
+
+<template>
+  <NuxtExampleLayout example="composables/use-fetch">
+    <div>
+      Fetch result:
+      <pre class="text-left"><code>{{ data }}</code></pre>
+      <NButton @click="count++">
+        +
+      </NButton>
+    </div>
+  </NuxtExampleLayout>
+</template>
diff --git a/examples/use-state/nuxt.config.ts b/examples/composables/use-fetch/nuxt.config.ts
similarity index 100%
rename from examples/use-state/nuxt.config.ts
rename to examples/composables/use-fetch/nuxt.config.ts
diff --git a/examples/use-fetch/package.json b/examples/composables/use-fetch/package.json
similarity index 100%
rename from examples/use-fetch/package.json
rename to examples/composables/use-fetch/package.json
diff --git a/examples/use-fetch/server/api/hello.ts b/examples/composables/use-fetch/server/api/hello.ts
similarity index 100%
rename from examples/use-fetch/server/api/hello.ts
rename to examples/composables/use-fetch/server/api/hello.ts
diff --git a/examples/with-components/tsconfig.json b/examples/composables/use-fetch/tsconfig.json
similarity index 100%
rename from examples/with-components/tsconfig.json
rename to examples/composables/use-fetch/tsconfig.json
diff --git a/examples/use-meta/app.vue b/examples/composables/use-meta/app.vue
similarity index 64%
rename from examples/use-meta/app.vue
rename to examples/composables/use-meta/app.vue
index 7590d28092c..a7297f7956a 100644
--- a/examples/use-meta/app.vue
+++ b/examples/composables/use-meta/app.vue
@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout example="use-meta" show-tips>
+  <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"
     >
@@ -20,21 +20,6 @@
         Click me and see the dynamic title
       </NButton>
     </div>
-
-    <template #tips>
-      <div class="flex-auto">
-        <p>
-          This example shows how to use <code>useMeta</code> and Nuxt built-in components to bind meta data to the <code>head</code> of the page.
-        </p>
-        <p>
-          Learn more about
-          <NuxtLink to="https://v3.nuxtjs.org/docs/usage/meta-tags" target="_blank">
-            Meta tags
-          </NuxtLink>.
-          Open in editor to see the source code 👉
-        </p>
-      </div>
-    </template>
   </NuxtExampleLayout>
 </template>
 
diff --git a/examples/with-composables/nuxt.config.ts b/examples/composables/use-meta/nuxt.config.ts
similarity index 100%
rename from examples/with-composables/nuxt.config.ts
rename to examples/composables/use-meta/nuxt.config.ts
diff --git a/examples/use-meta/package.json b/examples/composables/use-meta/package.json
similarity index 100%
rename from examples/use-meta/package.json
rename to examples/composables/use-meta/package.json
diff --git a/examples/with-errors/tsconfig.json b/examples/composables/use-meta/tsconfig.json
similarity index 100%
rename from examples/with-errors/tsconfig.json
rename to examples/composables/use-meta/tsconfig.json
diff --git a/examples/composables/use-state/app.vue b/examples/composables/use-state/app.vue
new file mode 100644
index 00000000000..479ecfc8938
--- /dev/null
+++ b/examples/composables/use-state/app.vue
@@ -0,0 +1,17 @@
+<script setup>
+const counter = useState('counter', () => Math.round(Math.random() * 1000))
+</script>
+
+<template>
+  <NuxtExampleLayout example="composables/use-state">
+    <div>Counter: {{ counter }}</div>
+    <div>
+      <NButton class="font-mono" @click="counter++">
+        +
+      </NButton>
+      <NButton class="font-mono" @click="counter--">
+        -
+      </NButton>
+    </div>
+  </NuxtExampleLayout>
+</template>
diff --git a/examples/with-errors/nuxt.config.ts b/examples/composables/use-state/nuxt.config.ts
similarity index 100%
rename from examples/with-errors/nuxt.config.ts
rename to examples/composables/use-state/nuxt.config.ts
diff --git a/examples/use-state/package.json b/examples/composables/use-state/package.json
similarity index 100%
rename from examples/use-state/package.json
rename to examples/composables/use-state/package.json
diff --git a/examples/use-state/tsconfig.json b/examples/composables/use-state/tsconfig.json
similarity index 100%
rename from examples/use-state/tsconfig.json
rename to examples/composables/use-state/tsconfig.json
diff --git a/examples/hello-world/app.vue b/examples/essentials/hello-world/app.vue
similarity index 100%
rename from examples/hello-world/app.vue
rename to examples/essentials/hello-world/app.vue
diff --git a/examples/with-test/nuxt.config.ts b/examples/essentials/hello-world/nuxt.config.ts
similarity index 100%
rename from examples/with-test/nuxt.config.ts
rename to examples/essentials/hello-world/nuxt.config.ts
diff --git a/examples/hello-world/package.json b/examples/essentials/hello-world/package.json
similarity index 100%
rename from examples/hello-world/package.json
rename to examples/essentials/hello-world/package.json
diff --git a/examples/with-layouts/tsconfig.json b/examples/essentials/hello-world/tsconfig.json
similarity index 100%
rename from examples/with-layouts/tsconfig.json
rename to examples/essentials/hello-world/tsconfig.json
diff --git a/examples/experimental/reactivity-transform/app.vue b/examples/experimental/reactivity-transform/app.vue
new file mode 100644
index 00000000000..b89750f8721
--- /dev/null
+++ b/examples/experimental/reactivity-transform/app.vue
@@ -0,0 +1,26 @@
+<script setup lang="ts">
+let count = $ref(0)
+
+function inc () {
+  count++
+}
+function dec () {
+  count--
+}
+</script>
+
+<template>
+  <NuxtExampleLayout example="experimental/reactivity-transform">
+    <div>
+      <Label :count="count" />
+      <div class="flex gap-1 justify-center">
+        <NButton @click="inc()">
+          Inc
+        </NButton>
+        <NButton @click="dec()">
+          Dec
+        </NButton>
+      </div>
+    </div>
+  </NuxtExampleLayout>
+</template>
diff --git a/examples/with-reactivity-transform/label.vue b/examples/experimental/reactivity-transform/components/label.vue
similarity index 100%
rename from examples/with-reactivity-transform/label.vue
rename to examples/experimental/reactivity-transform/components/label.vue
diff --git a/examples/with-reactivity-transform/nuxt.config.ts b/examples/experimental/reactivity-transform/nuxt.config.ts
similarity index 100%
rename from examples/with-reactivity-transform/nuxt.config.ts
rename to examples/experimental/reactivity-transform/nuxt.config.ts
diff --git a/examples/with-composables/package.json b/examples/experimental/reactivity-transform/package.json
similarity index 83%
rename from examples/with-composables/package.json
rename to examples/experimental/reactivity-transform/package.json
index 666b5ab0e05..ea8e4cb6afc 100644
--- a/examples/with-composables/package.json
+++ b/examples/experimental/reactivity-transform/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "example-with-composables",
+  "name": "example-reactivity-transform",
   "private": true,
   "scripts": {
     "build": "nuxi build",
diff --git a/examples/with-middleware/tsconfig.json b/examples/experimental/reactivity-transform/tsconfig.json
similarity index 100%
rename from examples/with-middleware/tsconfig.json
rename to examples/experimental/reactivity-transform/tsconfig.json
diff --git a/examples/with-wasm/app.vue b/examples/experimental/wasm/app.vue
similarity index 69%
rename from examples/with-wasm/app.vue
rename to examples/experimental/wasm/app.vue
index 7320d8c66e6..193b6581c47 100644
--- a/examples/with-wasm/app.vue
+++ b/examples/experimental/wasm/app.vue
@@ -8,7 +8,7 @@ const { data } = await useAsyncData('sum',
 </script>
 
 <template>
-  <NuxtExampleLayout show-tips example="with-wasm">
+  <NuxtExampleLayout example="experimental/wasm">
     <p>
       <code>a = 100</code>
     </p>
@@ -20,11 +20,5 @@ const { data } = await useAsyncData('sum',
       <br>
       <code>{{ a }} + {{ b }} = {{ data.sum }}</code>
     </p>
-
-    <template #tips>
-      <p>
-        This example demonstrates the server-side support of WebAssembly in Nuxt 3.
-      </p>
-    </template>
   </NuxtExampleLayout>
 </template>
diff --git a/examples/with-wasm/nuxt.config.ts b/examples/experimental/wasm/nuxt.config.ts
similarity index 100%
rename from examples/with-wasm/nuxt.config.ts
rename to examples/experimental/wasm/nuxt.config.ts
diff --git a/examples/experimental/wasm/package.json b/examples/experimental/wasm/package.json
new file mode 100644
index 00000000000..c398eb875b7
--- /dev/null
+++ b/examples/experimental/wasm/package.json
@@ -0,0 +1,13 @@
+{
+  "name": "example-wasm",
+  "private": true,
+  "devDependencies": {
+    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
+    "nuxt3": "latest"
+  },
+  "scripts": {
+    "dev": "nuxi dev",
+    "build": "nuxi build",
+    "start": "nuxi preview"
+  }
+}
diff --git a/examples/with-wasm/server/api/sum.ts b/examples/experimental/wasm/server/api/sum.ts
similarity index 100%
rename from examples/with-wasm/server/api/sum.ts
rename to examples/experimental/wasm/server/api/sum.ts
diff --git a/examples/with-wasm/server/wasm/sum.wasm b/examples/experimental/wasm/server/wasm/sum.wasm
similarity index 100%
rename from examples/with-wasm/server/wasm/sum.wasm
rename to examples/experimental/wasm/server/wasm/sum.wasm
diff --git a/examples/with-wasm/server/wasm/sum.wat b/examples/experimental/wasm/server/wasm/sum.wat
similarity index 100%
rename from examples/with-wasm/server/wasm/sum.wat
rename to examples/experimental/wasm/server/wasm/sum.wat
diff --git a/examples/with-pages/tsconfig.json b/examples/experimental/wasm/tsconfig.json
similarity index 100%
rename from examples/with-pages/tsconfig.json
rename to examples/experimental/wasm/tsconfig.json
diff --git a/examples/module-extend-pages/layouts/default.vue b/examples/module-extend-pages/layouts/default.vue
deleted file mode 100644
index fc8a25bd568..00000000000
--- a/examples/module-extend-pages/layouts/default.vue
+++ /dev/null
@@ -1,10 +0,0 @@
-<template>
-  <NuxtExampleLayout show-tips example="module-extend-pages">
-    <slot />
-    <template #tips>
-      <p>
-        This example defines a new <code>test</code> page using <code>extendPages</code> within a module.
-      </p>
-    </template>
-  </NuxtExampleLayout>
-</template>
diff --git a/examples/nuxt-link/app.vue b/examples/nuxt-link/app.vue
deleted file mode 100644
index 79e9a9512eb..00000000000
--- a/examples/nuxt-link/app.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<template>
-  <NuxtExampleLayout show-tips example="nuxt-link" class="example">
-    <NuxtPage />
-    <template #tips>
-      <p>
-        This example shows different ways to use <code>Nuxtlink</code>.
-        <code>components/myNuxtLink.js</code> defines a custom <code>NuxtLink</code>.
-      </p>
-    </template>
-  </NuxtExampleLayout>
-</template>
-
-<style>
-.example a {
-  font-family: Arial, Helvetica, sans-serif;
-  padding: 1rem 10rem;
-  display: block;
-}
-</style>
diff --git a/examples/locale/app.vue b/examples/other/locale/app.vue
similarity index 63%
rename from examples/locale/app.vue
rename to examples/other/locale/app.vue
index 6c7d029d000..7d22169eb64 100644
--- a/examples/locale/app.vue
+++ b/examples/other/locale/app.vue
@@ -6,7 +6,7 @@ const date = useLocaleDate(new Date('2016-10-26') /* NUXT_BIRTHDAY */)
 </script>
 
 <template>
-  <NuxtExampleLayout show-tips example="locale">
+  <NuxtExampleLayout example="other/locale">
     <h1 class="text-xl opacity-50">
       Nuxt birthday
     </h1>
@@ -20,14 +20,5 @@ const date = useLocaleDate(new Date('2016-10-26') /* NUXT_BIRTHDAY */)
         {{ l }}
       </option>
     </select>
-
-    <template #tips>
-      <p>
-        This example shows how to define a locale composable to handle the application's locale, both server and client-side.
-      </p>
-      <p>
-        You can right click to "View Page Source" and see that Nuxt renders the correct date in SSR based on visitor's locale.
-      </p>
-    </template>
   </NuxtExampleLayout>
 </template>
diff --git a/examples/locale/composables/locale.ts b/examples/other/locale/composables/locale.ts
similarity index 100%
rename from examples/locale/composables/locale.ts
rename to examples/other/locale/composables/locale.ts
diff --git a/examples/with-layouts/nuxt.config.ts b/examples/other/locale/nuxt.config.ts
similarity index 100%
rename from examples/with-layouts/nuxt.config.ts
rename to examples/other/locale/nuxt.config.ts
diff --git a/examples/locale/package.json b/examples/other/locale/package.json
similarity index 100%
rename from examples/locale/package.json
rename to examples/other/locale/package.json
diff --git a/examples/with-plugins/tsconfig.json b/examples/other/locale/tsconfig.json
similarity index 100%
rename from examples/with-plugins/tsconfig.json
rename to examples/other/locale/tsconfig.json
diff --git a/examples/with-layouts/layouts/custom.vue b/examples/routing/layouts/layouts/custom.vue
similarity index 100%
rename from examples/with-layouts/layouts/custom.vue
rename to examples/routing/layouts/layouts/custom.vue
diff --git a/examples/with-layouts/layouts/default.vue b/examples/routing/layouts/layouts/default.vue
similarity index 100%
rename from examples/with-layouts/layouts/default.vue
rename to examples/routing/layouts/layouts/default.vue
diff --git a/examples/with-layouts/layouts/other.vue b/examples/routing/layouts/layouts/other.vue
similarity index 100%
rename from examples/with-layouts/layouts/other.vue
rename to examples/routing/layouts/layouts/other.vue
diff --git a/examples/with-middleware/nuxt.config.ts b/examples/routing/layouts/nuxt.config.ts
similarity index 100%
rename from examples/with-middleware/nuxt.config.ts
rename to examples/routing/layouts/nuxt.config.ts
diff --git a/examples/routing/layouts/package.json b/examples/routing/layouts/package.json
new file mode 100644
index 00000000000..bcb61a5b9cc
--- /dev/null
+++ b/examples/routing/layouts/package.json
@@ -0,0 +1,13 @@
+{
+  "name": "example-layouts",
+  "private": true,
+  "scripts": {
+    "build": "nuxi build",
+    "dev": "nuxi dev",
+    "start": "nuxi preview"
+  },
+  "devDependencies": {
+    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
+    "nuxt3": "latest"
+  }
+}
diff --git a/examples/with-layouts/pages/custom.vue b/examples/routing/layouts/pages/custom.vue
similarity index 100%
rename from examples/with-layouts/pages/custom.vue
rename to examples/routing/layouts/pages/custom.vue
diff --git a/examples/with-layouts/pages/default.vue b/examples/routing/layouts/pages/default.vue
similarity index 100%
rename from examples/with-layouts/pages/default.vue
rename to examples/routing/layouts/pages/default.vue
diff --git a/examples/with-layouts/pages/dynamic.vue b/examples/routing/layouts/pages/dynamic.vue
similarity index 100%
rename from examples/with-layouts/pages/dynamic.vue
rename to examples/routing/layouts/pages/dynamic.vue
diff --git a/examples/with-layouts/pages/index.vue b/examples/routing/layouts/pages/index.vue
similarity index 53%
rename from examples/with-layouts/pages/index.vue
rename to examples/routing/layouts/pages/index.vue
index 95164ab68fe..e66905fb951 100644
--- a/examples/with-layouts/pages/index.vue
+++ b/examples/routing/layouts/pages/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <NuxtExampleLayout show-tips example="with-layouts">
+  <NuxtExampleLayout example="routing/layouts">
     <template #nav>
       <nav class="flex align-center gap-4 p-4">
         <NuxtLink to="/default">
@@ -13,14 +13,5 @@
         </NuxtLink>
       </nav>
     </template>
-
-    <template #tips>
-      <div>
-        <p>This example shows how to define default and custom layouts.</p>
-        <a href="https://v3.nuxtjs.org/docs/directory-structure/layouts" target="_blank">
-          Read more about layouts
-        </a>
-      </div>
-    </template>
   </NuxtExampleLayout>
 </template>
diff --git a/examples/with-reactivity-transform/tsconfig.json b/examples/routing/layouts/tsconfig.json
similarity index 100%
rename from examples/with-reactivity-transform/tsconfig.json
rename to examples/routing/layouts/tsconfig.json
diff --git a/examples/with-middleware/app.vue b/examples/routing/middleware/app.vue
similarity index 59%
rename from examples/with-middleware/app.vue
rename to examples/routing/middleware/app.vue
index 8571074416c..6ecc44ead0c 100644
--- a/examples/with-middleware/app.vue
+++ b/examples/routing/middleware/app.vue
@@ -3,7 +3,7 @@ const route = useRoute()
 </script>
 
 <template>
-  <NuxtExampleLayout show-tips example="with-middleware">
+  <NuxtExampleLayout example="routing/middleware">
     <NuxtPage />
 
     <template #nav>
@@ -25,13 +25,5 @@ const route = useRoute()
         Current route: <code>{{ route.path }}</code>
       </div>
     </template>
-    <template #tips>
-      <div>
-        <p>This example shows how to add route middleware with the <code>middleware/</code> directory or with a plugin, and how to use them globally or per page.</p>
-        <a href="https://v3.nuxtjs.org/docs/directory-structure/middleware" target="_blank">
-          Read more about middleware
-        </a>
-      </div>
-    </template>
   </NuxtExampleLayout>
 </template>
diff --git a/examples/with-middleware/middleware/always-run.global.ts b/examples/routing/middleware/middleware/always-run.global.ts
similarity index 100%
rename from examples/with-middleware/middleware/always-run.global.ts
rename to examples/routing/middleware/middleware/always-run.global.ts
diff --git a/examples/with-middleware/middleware/redirect-me.ts b/examples/routing/middleware/middleware/redirect-me.ts
similarity index 100%
rename from examples/with-middleware/middleware/redirect-me.ts
rename to examples/routing/middleware/middleware/redirect-me.ts
diff --git a/examples/with-pages/nuxt.config.ts b/examples/routing/middleware/nuxt.config.ts
similarity index 100%
rename from examples/with-pages/nuxt.config.ts
rename to examples/routing/middleware/nuxt.config.ts
diff --git a/examples/routing/middleware/package.json b/examples/routing/middleware/package.json
new file mode 100644
index 00000000000..ef6d04f35ce
--- /dev/null
+++ b/examples/routing/middleware/package.json
@@ -0,0 +1,13 @@
+{
+  "name": "example-middleware",
+  "private": true,
+  "scripts": {
+    "build": "nuxi build",
+    "dev": "nuxi dev",
+    "start": "nuxi preview"
+  },
+  "devDependencies": {
+    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
+    "nuxt3": "latest"
+  }
+}
diff --git a/examples/with-middleware/pages/forbidden.vue b/examples/routing/middleware/pages/forbidden.vue
similarity index 100%
rename from examples/with-middleware/pages/forbidden.vue
rename to examples/routing/middleware/pages/forbidden.vue
diff --git a/examples/with-middleware/pages/index.vue b/examples/routing/middleware/pages/index.vue
similarity index 100%
rename from examples/with-middleware/pages/index.vue
rename to examples/routing/middleware/pages/index.vue
diff --git a/examples/with-middleware/pages/redirect.vue b/examples/routing/middleware/pages/redirect.vue
similarity index 100%
rename from examples/with-middleware/pages/redirect.vue
rename to examples/routing/middleware/pages/redirect.vue
diff --git a/examples/with-middleware/pages/secret.vue b/examples/routing/middleware/pages/secret.vue
similarity index 100%
rename from examples/with-middleware/pages/secret.vue
rename to examples/routing/middleware/pages/secret.vue
diff --git a/examples/with-middleware/plugins/add.ts b/examples/routing/middleware/plugins/add.ts
similarity index 100%
rename from examples/with-middleware/plugins/add.ts
rename to examples/routing/middleware/plugins/add.ts
diff --git a/examples/with-test/tsconfig.json b/examples/routing/middleware/tsconfig.json
similarity index 100%
rename from examples/with-test/tsconfig.json
rename to examples/routing/middleware/tsconfig.json
diff --git a/examples/routing/nuxt-link/app.vue b/examples/routing/nuxt-link/app.vue
new file mode 100644
index 00000000000..66f1679a6ce
--- /dev/null
+++ b/examples/routing/nuxt-link/app.vue
@@ -0,0 +1,13 @@
+<template>
+  <NuxtExampleLayout example="routing/nuxt-link" class="example">
+    <NuxtPage />
+  </NuxtExampleLayout>
+</template>
+
+<style>
+.example a {
+  font-family: Arial, Helvetica, sans-serif;
+  padding: 1rem 10rem;
+  display: block;
+}
+</style>
diff --git a/examples/nuxt-link/components/MyNuxtLink.js b/examples/routing/nuxt-link/components/MyNuxtLink.js
similarity index 100%
rename from examples/nuxt-link/components/MyNuxtLink.js
rename to examples/routing/nuxt-link/components/MyNuxtLink.js
diff --git a/examples/with-plugins/nuxt.config.ts b/examples/routing/nuxt-link/nuxt.config.ts
similarity index 100%
rename from examples/with-plugins/nuxt.config.ts
rename to examples/routing/nuxt-link/nuxt.config.ts
diff --git a/examples/nuxt-link/package.json b/examples/routing/nuxt-link/package.json
similarity index 100%
rename from examples/nuxt-link/package.json
rename to examples/routing/nuxt-link/package.json
diff --git a/examples/nuxt-link/pages/about.vue b/examples/routing/nuxt-link/pages/about.vue
similarity index 100%
rename from examples/nuxt-link/pages/about.vue
rename to examples/routing/nuxt-link/pages/about.vue
diff --git a/examples/nuxt-link/pages/index.vue b/examples/routing/nuxt-link/pages/index.vue
similarity index 100%
rename from examples/nuxt-link/pages/index.vue
rename to examples/routing/nuxt-link/pages/index.vue
diff --git a/examples/with-universal-router/tsconfig.json b/examples/routing/nuxt-link/tsconfig.json
similarity index 100%
rename from examples/with-universal-router/tsconfig.json
rename to examples/routing/nuxt-link/tsconfig.json
diff --git a/examples/with-pages/app.vue b/examples/routing/pages/app.vue
similarity index 75%
rename from examples/with-pages/app.vue
rename to examples/routing/pages/app.vue
index 59d0c05224a..9f44a00aaa3 100644
--- a/examples/with-pages/app.vue
+++ b/examples/routing/pages/app.vue
@@ -3,7 +3,7 @@ const route = useRoute()
 </script>
 
 <template>
-  <NuxtExampleLayout show-tips example="with-pages">
+  <NuxtExampleLayout example="routing/pages">
     <NuxtPage />
 
     <template #nav>
@@ -34,14 +34,5 @@ const route = useRoute()
         Current route: <code>{{ route.path }}</code>
       </div>
     </template>
-
-    <template #tips>
-      <div>
-        <p>This example shows how to use the <code>pages/</code> directory.</p>
-        <a href="https://v3.nuxtjs.org/docs/directory-structure/pages" target="_blank">
-          Read more about pages
-        </a>
-      </div>
-    </template>
   </NuxtExampleLayout>
 </template>
diff --git a/examples/with-universal-router/nuxt.config.ts b/examples/routing/pages/nuxt.config.ts
similarity index 100%
rename from examples/with-universal-router/nuxt.config.ts
rename to examples/routing/pages/nuxt.config.ts
diff --git a/examples/routing/pages/package.json b/examples/routing/pages/package.json
new file mode 100644
index 00000000000..34872429855
--- /dev/null
+++ b/examples/routing/pages/package.json
@@ -0,0 +1,13 @@
+{
+  "name": "example-pages",
+  "private": true,
+  "scripts": {
+    "build": "nuxi build",
+    "dev": "nuxi dev",
+    "start": "nuxi preview"
+  },
+  "devDependencies": {
+    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
+    "nuxt3": "latest"
+  }
+}
diff --git a/examples/with-pages/pages/about.vue b/examples/routing/pages/pages/about.vue
similarity index 100%
rename from examples/with-pages/pages/about.vue
rename to examples/routing/pages/pages/about.vue
diff --git a/examples/with-pages/pages/catchall/[...id].vue b/examples/routing/pages/pages/catchall/[...id].vue
similarity index 100%
rename from examples/with-pages/pages/catchall/[...id].vue
rename to examples/routing/pages/pages/catchall/[...id].vue
diff --git a/examples/with-pages/pages/index.vue b/examples/routing/pages/pages/index.vue
similarity index 100%
rename from examples/with-pages/pages/index.vue
rename to examples/routing/pages/pages/index.vue
diff --git a/examples/with-pages/pages/parent.vue b/examples/routing/pages/pages/parent.vue
similarity index 100%
rename from examples/with-pages/pages/parent.vue
rename to examples/routing/pages/pages/parent.vue
diff --git a/examples/with-pages/pages/parent/b.vue b/examples/routing/pages/pages/parent/b.vue
similarity index 100%
rename from examples/with-pages/pages/parent/b.vue
rename to examples/routing/pages/pages/parent/b.vue
diff --git a/examples/with-pages/pages/parent/index.vue b/examples/routing/pages/pages/parent/index.vue
similarity index 100%
rename from examples/with-pages/pages/parent/index.vue
rename to examples/routing/pages/pages/parent/index.vue
diff --git a/examples/with-pages/pages/parent/reload-[id].vue b/examples/routing/pages/pages/parent/reload-[id].vue
similarity index 100%
rename from examples/with-pages/pages/parent/reload-[id].vue
rename to examples/routing/pages/pages/parent/reload-[id].vue
diff --git a/examples/with-pages/pages/parent/static-[id].vue b/examples/routing/pages/pages/parent/static-[id].vue
similarity index 100%
rename from examples/with-pages/pages/parent/static-[id].vue
rename to examples/routing/pages/pages/parent/static-[id].vue
diff --git a/examples/with-wasm/tsconfig.json b/examples/routing/pages/tsconfig.json
similarity index 100%
rename from examples/with-wasm/tsconfig.json
rename to examples/routing/pages/tsconfig.json
diff --git a/examples/with-universal-router/app.vue b/examples/routing/universal-router/app.vue
similarity index 74%
rename from examples/with-universal-router/app.vue
rename to examples/routing/universal-router/app.vue
index 661b34f8c93..f28d201649f 100644
--- a/examples/with-universal-router/app.vue
+++ b/examples/routing/universal-router/app.vue
@@ -4,7 +4,7 @@ const timer = useState('timer', () => 0)
 </script>
 
 <template>
-  <NuxtExampleLayout show-tips example="with-universal-router">
+  <NuxtExampleLayout example="routing/universal-router">
     A page...
     <br>
 
@@ -31,13 +31,5 @@ const timer = useState('timer', () => 0)
         Current route: <code>{{ route.path }}</code>
       </div>
     </template>
-
-    <template #tips>
-      <div>
-        <p>
-          This example demonstrates Nuxt universal routing utilities without depending on `pages/` and `vue-router`.
-        </p>
-      </div>
-    </template>
   </NuxtExampleLayout>
 </template>
diff --git a/examples/routing/universal-router/nuxt.config.ts b/examples/routing/universal-router/nuxt.config.ts
new file mode 100644
index 00000000000..9850816d150
--- /dev/null
+++ b/examples/routing/universal-router/nuxt.config.ts
@@ -0,0 +1,7 @@
+import { defineNuxtConfig } from 'nuxt3'
+
+export default defineNuxtConfig({
+  modules: [
+    '@nuxt/ui'
+  ]
+})
diff --git a/examples/with-components/package.json b/examples/routing/universal-router/package.json
similarity index 84%
rename from examples/with-components/package.json
rename to examples/routing/universal-router/package.json
index 8d92c0fd5f3..9073a318b3b 100644
--- a/examples/with-components/package.json
+++ b/examples/routing/universal-router/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "example-with-components",
+  "name": "example-universal-router",
   "private": true,
   "scripts": {
     "build": "nuxi build",
diff --git a/examples/with-universal-router/plugins/add.ts b/examples/routing/universal-router/plugins/add.ts
similarity index 100%
rename from examples/with-universal-router/plugins/add.ts
rename to examples/routing/universal-router/plugins/add.ts
diff --git a/examples/routing/universal-router/tsconfig.json b/examples/routing/universal-router/tsconfig.json
new file mode 100644
index 00000000000..4b34df1571f
--- /dev/null
+++ b/examples/routing/universal-router/tsconfig.json
@@ -0,0 +1,3 @@
+{
+  "extends": "./.nuxt/tsconfig.json"
+}
diff --git a/examples/use-async-data/app.vue b/examples/use-async-data/app.vue
deleted file mode 100644
index fa1a0be39d6..00000000000
--- a/examples/use-async-data/app.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<script setup>
-const ctr = ref(0)
-const { data, refresh, pending } = await useAsyncData('/api/hello', () => $fetch(`/api/hello/${ctr.value}`), { watch: [ctr] })
-</script>
-
-<template>
-  <NuxtExampleLayout example="use-async-data" show-tips>
-    <div>{{ data }}</div>
-    <div>
-      <NButton :disabled="pending" @click="refresh">
-        Refresh Data
-      </NButton>
-      <NButton :disabled="pending" @click="ctr++">
-        +
-      </NButton>
-    </div>
-    <template #tips>
-      <div>
-        <p>
-          This example shows how to use <code>useAsyncData</code> to fetch data from an API endpoint.
-        </p>
-        <p>
-          Nuxt will automatically read files in the
-          <a href="https://v3.nuxtjs.org/docs/directory-structure/server#api-routes" target="_blank">
-            <code>~/server/api</code> directory
-          </a>
-          to create API endpoints. Learn more about
-          <a href="https://v3.nuxtjs.org/docs/usage/data-fetching" target="_blank">data fetching</a>
-        </p>
-      </div>
-    </template>
-  </NuxtExampleLayout>
-</template>
diff --git a/examples/use-fetch/app.vue b/examples/use-fetch/app.vue
deleted file mode 100644
index a219fd6fbc8..00000000000
--- a/examples/use-fetch/app.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-<script setup>
-const count = ref(1)
-const { data } = await useFetch(() => `/api/hello/${count.value}`, { params: { token: 123 } })
-</script>
-
-<template>
-  <NuxtExampleLayout example="use-fetch" show-tips>
-    <div>
-      Fetch result:
-      <pre class="text-left"><code>{{ data }}</code></pre>
-      <NButton @click="count++">
-        +
-      </NButton>
-    </div>
-    <template #tips>
-      <div>
-        <p>
-          This example shows how to use <code>useFetch</code> to fetch data from an API endpoint.
-        </p>
-        <p>
-          Nuxt will automatically read in files in the
-          <a href="https://v3.nuxtjs.org/docs/directory-structure/server#api-routes" target="_blank">
-            <code>~/server/api</code> directory
-          </a>
-          to create API endpoints. Learn more about
-          <a href="https://v3.nuxtjs.org/docs/usage/data-fetching" target="_blank">data fetching</a>.
-        </p>
-      </div>
-    </template>
-  </NuxtExampleLayout>
-</template>
diff --git a/examples/use-state/app.vue b/examples/use-state/app.vue
deleted file mode 100644
index f7f59a47684..00000000000
--- a/examples/use-state/app.vue
+++ /dev/null
@@ -1,28 +0,0 @@
-<script setup>
-const counter = useState('counter', () => Math.round(Math.random() * 1000))
-</script>
-
-<template>
-  <NuxtExampleLayout show-tips example="use-state">
-    <div>Counter: {{ counter }}</div>
-    <div>
-      <NButton class="font-mono" @click="counter++">
-        +
-      </NButton>
-      <NButton class="font-mono" @click="counter--">
-        -
-      </NButton>
-    </div>
-
-    <template #tips>
-      <div>
-        <NuxtLink to="https://v3.nuxtjs.org/docs/usage/state" target="_blank">
-          useState
-        </NuxtLink>
-        is an SSR-friendly ref replacement.
-        Its value will be preserved after server-side rendering
-        and shared across all components using a unique key.
-      </div>
-    </template>
-  </NuxtExampleLayout>
-</template>
diff --git a/examples/with-components/app.vue b/examples/with-components/app.vue
deleted file mode 100644
index 74807a6ec41..00000000000
--- a/examples/with-components/app.vue
+++ /dev/null
@@ -1,27 +0,0 @@
-<template>
-  <NuxtExampleLayout show-tips example="with-components">
-    <h1 class="text-xl opacity-50">
-      Auto Imported Components
-    </h1>
-    <div>
-      <!-- Auto Imported Components -->
-      <HelloWorld class="text-2xl" />
-      <Nuxt3 class="text-2xl" />
-      <ParentFolderHello class="mt-6" />
-      <NuxtWithPrefix class="mt-6" />
-    </div>
-
-    <template #tips>
-      <div>
-        <p>Components under <code>components/</code> directory are auto imported and can be directly used in your templates.</p>
-        <p>Other directories can be configured to support components auto-imports</p>
-        <p>
-          Read more about
-          <NuxtLink to="https://v3.nuxtjs.org/docs/directory-structure/components" target="_blank">
-            the components directory.
-          </NuxtLink>
-        </p>
-      </div>
-    </template>
-  </NuxtExampleLayout>
-</template>
diff --git a/examples/with-components/nuxt.d.ts b/examples/with-components/nuxt.d.ts
deleted file mode 100644
index aa1c5d21124..00000000000
--- a/examples/with-components/nuxt.d.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-// This file is auto generated by `nuxt prepare`
-// Please do not manually modify this file.
-
-/// <reference types="nuxt3" />
-/// <reference types="@nuxt/kit" />
-/// <reference types="@nuxt/nitro" />
-/// <reference path=".nuxt/components.d.ts" />
-/// <reference path=".nuxt/auto-imports.d.ts" />
-export {}
diff --git a/examples/with-composables/app.vue b/examples/with-composables/app.vue
deleted file mode 100644
index f4dd5c7cbd6..00000000000
--- a/examples/with-composables/app.vue
+++ /dev/null
@@ -1,38 +0,0 @@
-<template>
-  <NuxtExampleLayout show-tips example="with-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>
-    <p>
-      Named export <code>useD</code> : {{ d }}
-    </p>
-    <p>
-      Default export <code>useFoo</code> : {{ foo }}
-    </p>
-    <template #tips>
-      <div>
-        <p>
-          This example shows how to use the <code>composables/</code> directory to auto import composables.
-        </p>
-        <p>
-          If a default export is provided, the name of the composable will be mapped to the name of the file.
-          Named exports can be used as-is.
-        </p>
-      </div>
-    </template>
-  </NuxtExampleLayout>
-</template>
-
-<script setup>
-const a = useA()
-const b = useB()
-const c = useC()
-const d = useD()
-const foo = useFoo()
-</script>
diff --git a/examples/with-middleware/package.json b/examples/with-middleware/package.json
deleted file mode 100644
index bacf50d2ff5..00000000000
--- a/examples/with-middleware/package.json
+++ /dev/null
@@ -1,13 +0,0 @@
-{
-  "name": "example-with-middleware",
-  "private": true,
-  "scripts": {
-    "build": "nuxi build",
-    "dev": "nuxi dev",
-    "start": "nuxi preview"
-  },
-  "devDependencies": {
-    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
-    "nuxt3": "latest"
-  }
-}
diff --git a/examples/with-plugins/app.vue b/examples/with-plugins/app.vue
deleted file mode 100644
index 5ac77493ab3..00000000000
--- a/examples/with-plugins/app.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<template>
-  <NuxtExampleLayout example="with-plugins" show-tips>
-    <div>{{ $myPlugin() }}</div>
-
-    <template #tips>
-      <div>
-        <p>This example shows how to use the <code>plugins/</code> directory to auto-register plugins.</p>
-        <a href="https://v3.nuxtjs.org/docs/directory-structure/plugins" target="_blank">
-          Read more about plugins
-        </a>
-      </div>
-    </template>
-  </NuxtExampleLayout>
-</template>
diff --git a/examples/with-reactivity-transform/app.vue b/examples/with-reactivity-transform/app.vue
deleted file mode 100644
index ef0e09d94c1..00000000000
--- a/examples/with-reactivity-transform/app.vue
+++ /dev/null
@@ -1,42 +0,0 @@
-<script setup lang="ts">
-import Label from './label.vue'
-
-let count = $ref(0)
-
-function inc () {
-  count++
-}
-function dec () {
-  count--
-}
-</script>
-
-<template>
-  <NuxtExampleLayout show-tips example="with-reactivity-transform">
-    <div>
-      <Label :count="count" />
-      <div class="flex gap-1 justify-center">
-        <NButton @click="inc()">
-          Inc
-        </NButton>
-        <NButton @click="dec()">
-          Dec
-        </NButton>
-      </div>
-    </div>
-
-    <template #tips>
-      <div class="flex-auto">
-        <p>
-          This example demonstrates the support of Reactivity transforms in Nuxt 3.
-        </p>
-        <p>
-          Read the documentation about
-          <a href="https://vuejs.org/guide/extras/reactivity-transform.html" target="_blank">
-            Reactivity Transform.
-          </a>
-        </p>
-      </div>
-    </template>
-  </NuxtExampleLayout>
-</template>
diff --git a/examples/with-reactivity-transform/package.json b/examples/with-reactivity-transform/package.json
deleted file mode 100644
index a38f3a0b004..00000000000
--- a/examples/with-reactivity-transform/package.json
+++ /dev/null
@@ -1,13 +0,0 @@
-{
-  "name": "example-with-reactivity-transform",
-  "private": true,
-  "scripts": {
-    "build": "nuxi build",
-    "dev": "nuxi dev",
-    "start": "nuxi preview"
-  },
-  "devDependencies": {
-    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
-    "nuxt3": "latest"
-  }
-}
diff --git a/examples/with-universal-router/package.json b/examples/with-universal-router/package.json
deleted file mode 100644
index 3026a01a220..00000000000
--- a/examples/with-universal-router/package.json
+++ /dev/null
@@ -1,13 +0,0 @@
-{
-  "name": "example-with-universal-router",
-  "private": true,
-  "scripts": {
-    "build": "nuxi build",
-    "dev": "nuxi dev",
-    "start": "nuxi preview"
-  },
-  "devDependencies": {
-    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
-    "nuxt3": "latest"
-  }
-}
diff --git a/examples/with-wasm/package.json b/examples/with-wasm/package.json
deleted file mode 100644
index 77ba79eec98..00000000000
--- a/examples/with-wasm/package.json
+++ /dev/null
@@ -1,12 +0,0 @@
-{
-  "name": "example-with-wasm",
-  "private": true,
-  "devDependencies": {
-    "nuxt3": "latest"
-  },
-  "scripts": {
-    "dev": "nuxi dev",
-    "build": "nuxi build",
-    "start": "nuxi preview"
-  }
-}
diff --git a/package.json b/package.json
index 99ce6307181..ef4a846a042 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
   "type": "module",
   "workspaces": [
     "packages/*",
-    "examples/*",
+    "examples/*/*",
     "test/fixtures/*",
     "playground"
   ],
@@ -16,7 +16,9 @@
     "lint:docs": "./node_modules/.bin/markdownlint ./",
     "nuxi": "./node_modules/.bin/nuxi",
     "nuxt": "./node_modules/.bin/nuxi",
-    "play": "yarn run nuxi dev playground",
+    "play": "echo use yarn dev && exit 1",
+    "dev": "yarn run nuxi dev playground",
+    "dev:build": "yarn run nuxi build playground",
     "release": "yarn && yarn lint && FORCE_COLOR=1 lerna publish -m \"chore: release\" && yarn stub",
     "stub": "lerna run prepack -- --stub",
     "test:fixtures": "yarn nuxi prepare test/fixtures/basic && JITI_ESM_RESOLVE=1 vitest --dir test",
@@ -30,21 +32,20 @@
     "jiti": "^1.13.0",
     "nitropack-dev": "link:../nitropack",
     "nuxt3": "workspace:./packages/nuxt3",
-    "vite": "^2.8.6",
+    "vite": "^2.9.1",
     "unbuild": "^0.7.2"
   },
   "devDependencies": {
     "@iconify-json/carbon": "^1.1.2",
-    "@nuxt/ui": "^0.0.0-alpha.5",
     "@nuxtjs/eslint-config": "^9.0.0",
     "@nuxtjs/eslint-config-typescript": "^9.0.0",
     "@types/jsdom": "^16",
     "@types/node": "^16.11.26",
     "@types/object-hash": "^2",
-    "@unocss/reset": "^0.30.3",
-    "esbuild": "^0.14.27",
-    "eslint": "^8.11.0",
-    "eslint-plugin-jsdoc": "^38.0.6",
+    "@unocss/reset": "^0.30.11",
+    "esbuild": "^0.14.31",
+    "eslint": "^8.12.0",
+    "eslint-plugin-jsdoc": "^38.1.6",
     "execa": "^6.1.0",
     "expect-type": "^0.13.0",
     "globby": "^13.1.1",
@@ -56,7 +57,7 @@
     "pathe": "^0.2.0",
     "typescript": "^4.6.3",
     "unbuild": "^0.7.2",
-    "vitest": "^0.7.11",
+    "vitest": "^0.8.4",
     "vue-router": "^4.0.14",
     "vue-tsc": "^0.33.9"
   },
diff --git a/packages/bridge/package.json b/packages/bridge/package.json
index 62e35942232..e268132f9b9 100644
--- a/packages/bridge/package.json
+++ b/packages/bridge/package.json
@@ -25,7 +25,7 @@
     "@nuxt/nitro": "3.0.0",
     "@nuxt/postcss8": "^1.1.3",
     "@nuxt/schema": "3.0.0",
-    "@vitejs/plugin-legacy": "^1.7.1",
+    "@vitejs/plugin-legacy": "^1.8.0",
     "@vue/composition-api": "^1.4.9",
     "@vueuse/head": "^0.7.5",
     "acorn": "^8.7.0",
@@ -56,12 +56,12 @@
     "postcss-url": "^10.1.3",
     "scule": "^0.2.1",
     "semver": "^7.3.5",
-    "ufo": "^0.8.1",
+    "ufo": "^0.8.3",
     "unimport": "^0.1.3",
-    "unplugin": "^0.6.0",
-    "unplugin-vue2-script-setup": "^0.10.0",
-    "untyped": "^0.4.3",
-    "vite": "^2.8.6",
+    "unplugin": "^0.6.1",
+    "unplugin-vue2-script-setup": "^0.10.2",
+    "untyped": "^0.4.4",
+    "vite": "^2.9.1",
     "vite-plugin-vue2": "^1.9.3",
     "vue-template-compiler": "^2.6.14"
   },
diff --git a/packages/bridge/src/auto-imports.ts b/packages/bridge/src/auto-imports.ts
index ce8e6eeb43e..9ecad332f1e 100644
--- a/packages/bridge/src/auto-imports.ts
+++ b/packages/bridge/src/auto-imports.ts
@@ -4,7 +4,7 @@ import type { Preset } from 'unimport'
 import autoImports from '../../nuxt3/src/auto-imports/module'
 import { vuePreset } from '../../nuxt3/src/auto-imports/presets'
 
-const UnsupportedImports = new Set(['useAsyncData', 'useFetch', 'useError', 'throwError', 'clearError'])
+const UnsupportedImports = new Set(['useAsyncData', 'useFetch', 'useError', 'throwError', 'clearError', 'defineNuxtLink'])
 const CapiHelpers = new Set(Object.keys(CompositionApi))
 
 export function setupAutoImports () {
diff --git a/packages/bridge/src/runtime/composables.ts b/packages/bridge/src/runtime/composables.ts
index 4fa9ef40f25..190511a6b5a 100644
--- a/packages/bridge/src/runtime/composables.ts
+++ b/packages/bridge/src/runtime/composables.ts
@@ -8,7 +8,7 @@ import { sendRedirect } from 'h3'
 import defu from 'defu'
 import { useNuxtApp } from './app'
 
-export { useLazyAsyncData } from './asyncData'
+export { useLazyAsyncData, refreshNuxtData } from './asyncData'
 export { useLazyFetch } from './fetch'
 export { useCookie } from './cookie'
 export { useRequestHeaders } from './ssr'
diff --git a/packages/bridge/src/vite/client.ts b/packages/bridge/src/vite/client.ts
index 4e2d377c9fa..1fe6b0014bf 100644
--- a/packages/bridge/src/vite/client.ts
+++ b/packages/bridge/src/vite/client.ts
@@ -5,11 +5,14 @@ import PluginLegacy from '@vitejs/plugin-legacy'
 import { logger } from '@nuxt/kit'
 import { joinURL } from 'ufo'
 import { devStyleSSRPlugin } from '../../../vite/src/plugins/dev-ssr-css'
+import { RelativeAssetPlugin } from '../../../vite/src/plugins/dynamic-base'
 import { jsxPlugin } from './plugins/jsx'
 import { ViteBuildContext, ViteOptions } from './types'
 
 export async function buildClient (ctx: ViteBuildContext) {
-  const alias = {}
+  const alias = {
+    '#_config': resolve(ctx.nuxt.options.buildDir, 'config.client.mjs')
+  }
   for (const p of ctx.builder.plugins) {
     alias[p.name] = p.mode === 'server'
       ? `defaultexport:${resolve(ctx.nuxt.options.buildDir, 'empty.js')}`
@@ -18,27 +21,27 @@ export async function buildClient (ctx: ViteBuildContext) {
 
   const clientConfig: vite.InlineConfig = vite.mergeConfig(ctx.config, {
     define: {
-      'process.client': 'true',
-      'process.server': 'false',
-      'process.static': 'false',
-      'module.hot': 'false'
+      'process.client': true,
+      'process.server': false,
+      'process.static': false,
+      'module.hot': false
     },
     cacheDir: resolve(ctx.nuxt.options.rootDir, 'node_modules/.cache/vite/client'),
     resolve: {
       alias
     },
     build: {
-      outDir: resolve(ctx.nuxt.options.buildDir, 'dist/client'),
       rollupOptions: {
         input: resolve(ctx.nuxt.options.buildDir, 'client.js')
       },
       manifest: true,
-      ssrManifest: true
+      outDir: resolve(ctx.nuxt.options.buildDir, 'dist/client')
     },
     plugins: [
       jsxPlugin(),
       createVuePlugin(ctx.config.vue),
       PluginLegacy(),
+      RelativeAssetPlugin(),
       devStyleSSRPlugin({
         rootDir: ctx.nuxt.options.rootDir,
         buildAssetsURL: joinURL(ctx.nuxt.options.app.baseURL, ctx.nuxt.options.app.buildAssetsDir)
@@ -67,10 +70,6 @@ export async function buildClient (ctx: ViteBuildContext) {
   const viteMiddleware = (req, res, next) => {
     // Workaround: vite devmiddleware modifies req.url
     const originalURL = req.url
-    req.url = req.url.replace('/_nuxt/', '/.nuxt/')
-    if (req.url.includes('@vite/client')) {
-      req.url = '/@vite/client'
-    }
     viteServer.middlewares.handle(req, res, (err) => {
       req.url = originalURL
       next(err)
diff --git a/packages/bridge/src/vite/manifest.ts b/packages/bridge/src/vite/manifest.ts
index 4ea604ffce4..e7eaef1b366 100644
--- a/packages/bridge/src/vite/manifest.ts
+++ b/packages/bridge/src/vite/manifest.ts
@@ -56,22 +56,27 @@ export async function generateBuildManifest (ctx: ViteBuildContext) {
 
   // Search for polyfill file, we don't include it in the client entry
   const polyfillName = initialEntries.find(id => id.startsWith('polyfills-legacy.'))
+  const polyfill = await fse.readFile(rDist('client/' + polyfillName), 'utf-8')
 
   // @vitejs/plugin-legacy uses SystemJS which need to call `System.import` to load modules
   const clientImports = initialJs.filter(id => id !== polyfillName)
-  const clientEntryCode = `var imports = ${JSON.stringify(clientImports)}\nimports.reduce((p, id) => p.then(() => System.import(id)), Promise.resolve())`
+  const clientEntryCode = [
+    polyfill,
+    'var appConfig = window?.__NUXT__?.config.app || {}',
+    'var publicBase = appConfig.cdnURL || ("." + appConfig.baseURL)',
+    `var imports = ${JSON.stringify(clientImports)};`,
+    'imports.reduce((p, id) => p.then(() => System.import(publicBase + appConfig.buildAssetsDir.slice(1) + id)), Promise.resolve())'
+  ].join('\n')
   const clientEntryName = 'entry-legacy.' + hash(clientEntryCode) + '.js'
 
   const clientManifest = {
     // This publicPath will be ignored by Nitro and computed dynamically
     publicPath: ctx.nuxt.options.app.buildAssetsDir,
     all: uniq([
-      polyfillName,
       clientEntryName,
       ...clientEntries.flatMap(getModuleIds)
     ]).filter(Boolean),
     initial: [
-      polyfillName,
       clientEntryName,
       ...initialAssets
     ].filter(Boolean),
diff --git a/packages/bridge/src/vite/module.ts b/packages/bridge/src/vite/module.ts
index 30134d9f4d5..4c347da90fe 100644
--- a/packages/bridge/src/vite/module.ts
+++ b/packages/bridge/src/vite/module.ts
@@ -1,4 +1,5 @@
-import { logger, addPluginTemplate, defineNuxtModule } from '@nuxt/kit'
+import { logger, addPluginTemplate, defineNuxtModule, addTemplate } from '@nuxt/kit'
+import { publicPathTemplate, clientConfigTemplate } from '../../../nuxt3/src/core/templates'
 import { version } from '../../package.json'
 import { middlewareTemplate, storeTemplate } from './templates'
 import type { ViteOptions } from './types'
@@ -43,6 +44,12 @@ export default defineNuxtModule<ViteOptions>({
     }
     addPluginTemplate(middlewareTemplate)
 
+    addTemplate(clientConfigTemplate)
+    addTemplate({
+      ...publicPathTemplate,
+      options: { nuxt }
+    })
+
     nuxt.hook('builder:prepared', async (builder) => {
       if (nuxt.options._prepare) { return }
       builder.bundleBuilder.close()
diff --git a/packages/bridge/src/vite/server.ts b/packages/bridge/src/vite/server.ts
index 4017069f1bf..32fb40a3ae9 100644
--- a/packages/bridge/src/vite/server.ts
+++ b/packages/bridge/src/vite/server.ts
@@ -45,7 +45,11 @@ export async function buildServer (ctx: ViteBuildContext) {
         'axios'
       ],
       noExternal: [
+        // TODO: Use externality for production (rollup) build
+        /\/esm\/.*\.js$/,
         /\.(es|esm|esm-browser|esm-bundler).js$/,
+        '#app',
+        /@nuxt\/nitro\/(dist|src)/,
         ...ctx.nuxt.options.build.transpile.filter(i => typeof i === 'string')
       ]
     },
@@ -54,11 +58,14 @@ export async function buildServer (ctx: ViteBuildContext) {
       ssr: ctx.nuxt.options.ssr ?? true,
       ssrManifest: true,
       rollupOptions: {
+        // Private nitro alias: packages/nitro/src/rollup/config.ts#L234
+        external: ['#_config'],
         input: resolve(ctx.nuxt.options.buildDir, 'server.js'),
         output: {
-          format: 'esm',
           entryFileNames: 'server.mjs',
-          chunkFileNames: 'chunks/[name].mjs'
+          chunkFileNames: 'chunks/[name].mjs',
+          preferConst: true,
+          format: 'module'
         },
         onwarn (warning, rollupWarn) {
           if (!['UNUSED_EXTERNAL_IMPORT'].includes(warning.code)) {
@@ -67,6 +74,10 @@ export async function buildServer (ctx: ViteBuildContext) {
         }
       }
     },
+    server: {
+      // https://github.com/vitest-dev/vitest/issues/229#issuecomment-1002685027
+      preTransformRequests: false
+    },
     plugins: [
       jsxPlugin(),
       vuePlugin
diff --git a/packages/bridge/src/vite/vite.ts b/packages/bridge/src/vite/vite.ts
index 1ec626dc309..464fdbeefb3 100644
--- a/packages/bridge/src/vite/vite.ts
+++ b/packages/bridge/src/vite/vite.ts
@@ -1,9 +1,12 @@
 import { resolve } from 'pathe'
 import * as vite from 'vite'
-import { logger } from '@nuxt/kit'
-import { withoutLeadingSlash } from 'ufo'
+import { isIgnored, logger } from '@nuxt/kit'
+import { sanitizeFilePath } from 'mlly'
+import { getPort } from 'get-port-please'
+import { joinURL, withoutLeadingSlash } from 'ufo'
 import { distDir } from '../dirs'
 import { warmupViteServer } from '../../../vite/src/utils/warmup'
+import { DynamicBasePlugin } from '../../../vite/src/plugins/dynamic-base'
 import { buildClient } from './client'
 import { buildServer } from './server'
 import { defaultExportPlugin } from './plugins/default-export'
@@ -18,20 +21,43 @@ async function bundle (nuxt: Nuxt, builder: any) {
     p.src = nuxt.resolver.resolvePath(resolve(nuxt.options.buildDir, p.src))
   }
 
+  const hmrPortDefault = 24678 // Vite's default HMR port
+  const hmrPort = await getPort({
+    port: hmrPortDefault,
+    ports: Array.from({ length: 20 }, (_, i) => hmrPortDefault + 1 + i)
+  })
+
   const ctx: ViteBuildContext = {
     nuxt,
     builder,
     config: vite.mergeConfig(
       {
-        root: nuxt.options.rootDir,
+        // defaults from packages/schema/src/config/vite
+        root: nuxt.options.srcDir,
         mode: nuxt.options.dev ? 'development' : 'production',
         logLevel: 'warn',
+        base: nuxt.options.dev
+          ? joinURL(nuxt.options.app.baseURL, nuxt.options.app.buildAssetsDir)
+          : '/__NUXT_BASE__/',
+        publicDir: resolve(nuxt.options.rootDir, nuxt.options.srcDir, nuxt.options.dir.static),
+        vue: {
+          isProduction: !nuxt.options.dev,
+          template: {
+            compilerOptions: nuxt.options.vue.compilerOptions
+          }
+        },
+        esbuild: {
+          jsxFactory: 'h',
+          jsxFragment: 'Fragment',
+          tsconfigRaw: '{}'
+        },
+        clearScreen: false,
         define: {
+          'process.dev': nuxt.options.dev,
           'process.static': nuxt.options.target === 'static',
           'process.env.NODE_ENV': JSON.stringify(nuxt.options.dev ? 'development' : 'production'),
           'process.mode': JSON.stringify(nuxt.options.dev ? 'development' : 'production'),
-          'process.target': JSON.stringify(nuxt.options.target),
-          'process.dev': nuxt.options.dev
+          'process.target': JSON.stringify(nuxt.options.target)
         },
         resolve: {
           extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
@@ -39,22 +65,17 @@ async function bundle (nuxt: Nuxt, builder: any) {
             ...nuxt.options.alias,
             '#build': nuxt.options.buildDir,
             '.nuxt': nuxt.options.buildDir,
-            '/.nuxt/entry.mjs': resolve(nuxt.options.buildDir, 'client.js'),
+            '/entry.mjs': resolve(nuxt.options.buildDir, 'client.js'),
             'web-streams-polyfill/ponyfill/es2018': resolve(distDir, 'runtime/vite/mock/web-streams-polyfill.mjs'),
             'whatwg-url': resolve(distDir, 'runtime/vite/mock/whatwg-url.mjs'),
             // Cannot destructure property 'AbortController' of ..
             'abort-controller': resolve(distDir, 'runtime/vite/mock/abort-controller.mjs')
           }
         },
-        vue: {},
-        server: {
-          fs: {
-            strict: false
-          }
-        },
-        css: resolveCSSOptions(nuxt),
         optimizeDeps: {
           exclude: [
+            ...nuxt.options.build.transpile.filter(i => typeof i === 'string'),
+            'vue-demi',
             'ufo',
             'date-fns',
             'nanoid',
@@ -64,26 +85,42 @@ async function bundle (nuxt: Nuxt, builder: any) {
             // 'vue-demi'
           ]
         },
-        esbuild: {
-          jsxFactory: 'h',
-          jsxFragment: 'Fragment',
-          tsconfigRaw: '{}'
-        },
-        publicDir: resolve(nuxt.options.srcDir, nuxt.options.dir.static),
-        clearScreen: false,
+        css: resolveCSSOptions(nuxt),
         build: {
-          assetsDir: withoutLeadingSlash(nuxt.options.app.buildAssetsDir),
-          emptyOutDir: false
+          assetsDir: nuxt.options.dev ? withoutLeadingSlash(nuxt.options.app.buildAssetsDir) : '.',
+          emptyOutDir: false,
+          rollupOptions: {
+            output: { sanitizeFileName: sanitizeFilePath }
+          }
         },
         plugins: [
           replace({
             __webpack_public_path__: 'globalThis.__webpack_public_path__'
           }),
           jsxPlugin(),
+          DynamicBasePlugin.vite(),
           defaultExportPlugin()
-        ]
+        ],
+        server: {
+          watch: {
+            ignored: isIgnored
+          },
+          hmr: {
+            clientPort: hmrPort,
+            port: hmrPort
+          },
+          fs: {
+            strict: false,
+            allow: [
+              nuxt.options.buildDir,
+              nuxt.options.srcDir,
+              nuxt.options.rootDir,
+              ...nuxt.options.modulesDir
+            ]
+          }
+        }
       } as ViteOptions,
-      nuxt.options.vite || {}
+      nuxt.options.vite
     )
   }
 
diff --git a/packages/kit/package.json b/packages/kit/package.json
index 8d215afa062..f5810426608 100644
--- a/packages/kit/package.json
+++ b/packages/kit/package.json
@@ -28,9 +28,9 @@
     "pkg-types": "^0.3.2",
     "scule": "^0.2.1",
     "semver": "^7.3.5",
-    "unctx": "^1.1.2",
+    "unctx": "^1.1.4",
     "unimport": "^0.1.3",
-    "untyped": "^0.4.3"
+    "untyped": "^0.4.4"
   },
   "devDependencies": {
     "@types/lodash.template": "^4",
diff --git a/packages/nitro/package.json b/packages/nitro/package.json
index cafd46393aa..7bd0c77da9d 100644
--- a/packages/nitro/package.json
+++ b/packages/nitro/package.json
@@ -19,7 +19,7 @@
     "@nuxt/kit": "3.0.0",
     "@nuxt/ui-templates": "npm:@nuxt/ui-templates-edge@latest",
     "@rollup/plugin-alias": "^3.1.9",
-    "@rollup/plugin-commonjs": "^21.0.2",
+    "@rollup/plugin-commonjs": "^21.0.3",
     "@rollup/plugin-inject": "^4.0.4",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.1.3",
@@ -37,7 +37,7 @@
     "defu": "^6.0.0",
     "destr": "^1.1.0",
     "dot-prop": "^7.2.0",
-    "esbuild": "^0.14.27",
+    "esbuild": "^0.14.31",
     "etag": "^1.8.1",
     "fs-extra": "^10.0.1",
     "globby": "^13.1.1",
@@ -66,7 +66,7 @@
     "serve-static": "^1.15.0",
     "std-env": "^3.0.1",
     "table": "^6.8.0",
-    "ufo": "^0.8.1",
+    "ufo": "^0.8.3",
     "unenv": "^0.4.3",
     "unstorage": "^0.3.3",
     "vue-bundle-renderer": "^0.3.5",
diff --git a/packages/nitro/src/runtime/app/render.ts b/packages/nitro/src/runtime/app/render.ts
index d26a5045d0a..e854e983d45 100644
--- a/packages/nitro/src/runtime/app/render.ts
+++ b/packages/nitro/src/runtime/app/render.ts
@@ -158,6 +158,7 @@ async function renderHTML (payload, rendered, ssrContext) {
     HEAD: headTags +
       rendered.renderResourceHints() + rendered.renderStyles() + (ssrContext.styles || ''),
     BODY_ATTRS: bodyAttrs,
+    BODY_PREPEND: ssrContext.teleports?.body || '',
     APP: bodyScriptsPrepend + html + state + rendered.renderScripts() + bodyScripts
   })
 }
@@ -171,7 +172,7 @@ function _interopDefault (e) {
 }
 
 function cachedImport <M> (importer: () => Promise<M>) {
-  return cachedResult(() => importer().then(_interopDefault))
+  return cachedResult(() => importer().then(_interopDefault)) as () => Promise<M>
 }
 
 function cachedResult <T> (fn: () => Promise<T>): () => Promise<T> {
diff --git a/packages/nuxi/package.json b/packages/nuxi/package.json
index f1df1453c9f..d94844aabf5 100644
--- a/packages/nuxi/package.json
+++ b/packages/nuxi/package.json
@@ -24,6 +24,7 @@
     "@types/mri": "^1.1.1",
     "@types/rimraf": "^3",
     "@types/semver": "^7",
+    "c12": "^0.2.4",
     "chokidar": "^3.5.3",
     "clear": "^0.1.0",
     "clipboardy": "^3.0.0",
diff --git a/packages/nuxi/src/commands/dev.ts b/packages/nuxi/src/commands/dev.ts
index 32ce25e01eb..2f987e2f080 100644
--- a/packages/nuxi/src/commands/dev.ts
+++ b/packages/nuxi/src/commands/dev.ts
@@ -1,4 +1,4 @@
-import { resolve, relative } from 'pathe'
+import { resolve, relative, normalize } from 'pathe'
 import chokidar from 'chokidar'
 import { debounce } from 'perfect-debounce'
 import type { Nuxt } from '@nuxt/schema'
@@ -23,8 +23,8 @@ export default defineNuxtCommand({
     const listener = await server.listen({
       clipboard: args.clipboard,
       open: args.open || args.o,
-      port: args.port || args.p,
-      hostname: args.host || args.h,
+      port: args.port || args.p || process.env.NUXT_PORT,
+      hostname: args.host || args.h || process.env.NUXT_HOST,
       https: Boolean(args.https),
       certificate: (args['ssl-cert'] && args['ssl-key']) && {
         cert: args['ssl-cert'],
@@ -73,7 +73,7 @@ export default defineNuxtCommand({
     const watcher = chokidar.watch([rootDir], { ignoreInitial: true, depth: 1 })
     watcher.on('all', (event, file) => {
       if (!currentNuxt) { return }
-      if (file.startsWith(withTrailingSlash(currentNuxt.options.buildDir))) { return }
+      if (normalize(file).startsWith(withTrailingSlash(normalize(currentNuxt.options.buildDir)))) { return }
       if (file.match(/(nuxt\.config\.(js|ts|mjs|cjs)|\.nuxtignore|\.env|\.nuxtrc)$/)) {
         dLoad(true, `${relative(rootDir, file)} updated`)
       }
diff --git a/packages/nuxi/src/commands/preview.ts b/packages/nuxi/src/commands/preview.ts
index 8d55d334e4f..346d294052e 100644
--- a/packages/nuxi/src/commands/preview.ts
+++ b/packages/nuxi/src/commands/preview.ts
@@ -1,6 +1,7 @@
 import { existsSync, promises as fsp } from 'fs'
 import { dirname, relative } from 'path'
 import { execa } from 'execa'
+import { loadDotenv } from 'c12'
 import { resolve } from 'pathe'
 import consola from 'consola'
 
@@ -34,6 +35,11 @@ export default defineNuxtCommand({
       process.exit(1)
     }
 
+    if (existsSync(resolve(rootDir, '.env'))) {
+      consola.info('Loading `.env`. This will not be loaded when running the server in production.')
+      process.env = await loadDotenv({ cwd: rootDir, fileName: '.env', env: process.env })
+    }
+
     consola.info('Starting preview command:', nitroJSON.commands.preview)
     const [command, ...commandArgs] = nitroJSON.commands.preview.split(' ')
     consola.log('')
diff --git a/packages/nuxt3/package.json b/packages/nuxt3/package.json
index 2847a871627..a5988e6f38e 100644
--- a/packages/nuxt3/package.json
+++ b/packages/nuxt3/package.json
@@ -58,10 +58,11 @@
     "pathe": "^0.2.0",
     "perfect-debounce": "^0.1.3",
     "scule": "^0.2.1",
-    "ufo": "^0.8.1",
+    "ufo": "^0.8.3",
+    "unctx": "^1.1.4",
     "unimport": "^0.1.3",
-    "unplugin": "^0.6.0",
-    "untyped": "^0.4.3",
+    "unplugin": "^0.6.1",
+    "untyped": "^0.4.4",
     "vue": "^3.2.31",
     "vue-router": "^4.0.14"
   },
diff --git a/packages/nuxt3/src/app/composables/asyncData.ts b/packages/nuxt3/src/app/composables/asyncData.ts
index 38a4da50397..192558db4dd 100644
--- a/packages/nuxt3/src/app/composables/asyncData.ts
+++ b/packages/nuxt3/src/app/composables/asyncData.ts
@@ -21,12 +21,17 @@ export interface AsyncDataOptions<
   transform?: Transform
   pick?: PickKeys
   watch?: MultiWatchSources
+  initialCache?: boolean
+}
+
+export interface RefreshOptions {
+  _initial?: boolean
 }
 
 export interface _AsyncData<DataT> {
   data: Ref<DataT>
   pending: Ref<boolean>
-  refresh: (force?: boolean) => Promise<void>
+  refresh: (opts?: RefreshOptions) => Promise<void>
   error?: any
 }
 
@@ -58,6 +63,7 @@ export function useAsyncData<
     console.warn('[useAsyncData] `defer` has been renamed to `lazy`. Support for `defer` will be removed in RC.')
   }
   options.lazy = options.lazy ?? (options as any).defer ?? false
+  options.initialCache = options.initialCache ?? true
 
   // Setup nuxt instance payload
   const nuxt = useNuxtApp()
@@ -81,11 +87,15 @@ export function useAsyncData<
     error: ref(nuxt.payload._errors[key] ?? null)
   } as AsyncData<DataT>
 
-  asyncData.refresh = (force?: boolean) => {
+  asyncData.refresh = (opts = {}) => {
     // Avoid fetching same key more than once at a time
-    if (nuxt._asyncDataPromises[key] && !force) {
+    if (nuxt._asyncDataPromises[key]) {
       return nuxt._asyncDataPromises[key]
     }
+    // Avoid fetching same key that is already fetched
+    if (opts._initial && options.initialCache && nuxt.payload.data[key] !== undefined) {
+      return nuxt.payload.data[key]
+    }
     asyncData.pending.value = true
     // TODO: Cancel previous promise
     // TODO: Handle immediate errors
@@ -115,11 +125,13 @@ export function useAsyncData<
     return nuxt._asyncDataPromises[key]
   }
 
+  const initialFetch = () => asyncData.refresh({ _initial: true })
+
   const fetchOnServer = options.server !== false && nuxt.payload.serverRendered
 
   // Server side
   if (process.server && fetchOnServer) {
-    const promise = asyncData.refresh()
+    const promise = initialFetch()
     onServerPrefetch(() => promise)
   }
 
@@ -131,18 +143,21 @@ export function useAsyncData<
     } else if (instance && (nuxt.isHydrating || options.lazy)) {
       // 2. Initial load (server: false): fetch on mounted
       // 3. Navigation (lazy: true): fetch on mounted
-      instance._nuxtOnBeforeMountCbs.push(asyncData.refresh)
+      instance._nuxtOnBeforeMountCbs.push(initialFetch)
     } else {
       // 4. Navigation (lazy: false) - or plugin usage: await fetch
-      asyncData.refresh()
+      initialFetch()
     }
     if (options.watch) {
-      const unwatch = watch(options.watch, () => {
-        asyncData.refresh()
-      })
-      if (instance) {
-        onUnmounted(() => unwatch())
+      watch(options.watch, () => asyncData.refresh())
+    }
+    const off = nuxt.hook('app:data:refresh', (keys) => {
+      if (!keys || keys.includes(key)) {
+        return asyncData.refresh()
       }
+    })
+    if (instance) {
+      onUnmounted(off)
     }
   }
 
@@ -166,6 +181,14 @@ export function useLazyAsyncData<
   return useAsyncData(key, handler, { ...options, lazy: true })
 }
 
+export function refreshNuxtData (keys?: string | string[]): Promise<void> {
+  if (process.server) {
+    return Promise.resolve()
+  }
+  const _keys = keys ? Array.isArray(keys) ? keys : [keys] : undefined
+  return useNuxtApp().callHook('app:data:refresh', _keys)
+}
+
 function pick (obj: Record<string, any>, keys: string[]) {
   const newObj = {}
   for (const key of keys) {
diff --git a/packages/nuxt3/src/app/composables/fetch.ts b/packages/nuxt3/src/app/composables/fetch.ts
index 03d298e5d07..2a055d83094 100644
--- a/packages/nuxt3/src/app/composables/fetch.ts
+++ b/packages/nuxt3/src/app/composables/fetch.ts
@@ -7,11 +7,16 @@ import { useAsyncData } from './asyncData'
 
 export type FetchResult<ReqT extends FetchRequest> = TypedInternalResponse<ReqT, unknown>
 
-export type UseFetchOptions<
+export interface UseFetchOptions<
   DataT,
   Transform extends _Transform<DataT, any> = _Transform<DataT, DataT>,
   PickKeys extends KeyOfRes<Transform> = KeyOfRes<Transform>
-> = AsyncDataOptions<DataT, Transform, PickKeys> & FetchOptions & { key?: string }
+> extends
+  AsyncDataOptions<DataT, Transform, PickKeys>,
+  FetchOptions
+  {
+  key?: string
+ }
 
 export function useFetch<
   ResT = void,
@@ -32,15 +37,22 @@ export function useFetch<
     return isRef(r) ? r.value : r
   })
 
-  const asyncData = useAsyncData(key, () => {
-    return $fetch(_request.value, opts) as Promise<_ResT>
-  }, {
+  const _fetchOptions = {
+    ...opts,
+    cache: typeof opts.cache === 'boolean' ? undefined : opts.cache
+  }
+
+  const _asyncDataOptions: AsyncDataOptions<any> = {
     ...opts,
     watch: [
       _request,
       ...(opts.watch || [])
     ]
-  })
+  }
+
+  const asyncData = useAsyncData(key, () => {
+    return $fetch(_request.value, _fetchOptions) as Promise<_ResT>
+  }, _asyncDataOptions)
 
   return asyncData
 }
diff --git a/packages/nuxt3/src/app/composables/index.ts b/packages/nuxt3/src/app/composables/index.ts
index 9f47d42c530..03300f55334 100644
--- a/packages/nuxt3/src/app/composables/index.ts
+++ b/packages/nuxt3/src/app/composables/index.ts
@@ -1,5 +1,5 @@
 export { defineNuxtComponent } from './component'
-export { useAsyncData, useLazyAsyncData } from './asyncData'
+export { useAsyncData, useLazyAsyncData, refreshNuxtData } from './asyncData'
 export type { AsyncDataOptions, AsyncData } from './asyncData'
 export { useHydration } from './hydrate'
 export { useState } from './state'
diff --git a/packages/nuxt3/src/app/nuxt.ts b/packages/nuxt3/src/app/nuxt.ts
index d3af122c2cd..d2db362dc96 100644
--- a/packages/nuxt3/src/app/nuxt.ts
+++ b/packages/nuxt3/src/app/nuxt.ts
@@ -3,8 +3,11 @@ import { getCurrentInstance, reactive } from 'vue'
 import type { App, onErrorCaptured, VNode } from 'vue'
 import { createHooks, Hookable } from 'hookable'
 import type { RuntimeConfig } from '@nuxt/schema'
+import { getContext } from 'unctx'
 import { legacyPlugin, LegacyContext } from './compat/legacy-app'
 
+const nuxtAppCtx = getContext<NuxtApp>('nuxt-app')
+
 type NuxtMeta = {
   htmlAttrs?: string
   headAttrs?: string
@@ -23,6 +26,7 @@ export interface RuntimeNuxtHooks {
   'app:suspense:resolve': (Component?: VNode) => HookResult
   'app:error': (err: any) => HookResult
   'app:error:cleared': (options: { redirect?: string }) => HookResult
+  'app:data:refresh': (keys?: string[]) => HookResult
   'page:start': (Component?: VNode) => HookResult
   'page:finish': (Component?: VNode) => HookResult
   'meta:register': (metaRenderers: Array<(nuxt: NuxtApp) => NuxtMeta | Promise<NuxtMeta>>) => HookResult
@@ -171,12 +175,6 @@ export function isLegacyPlugin (plugin: unknown): plugin is LegacyPlugin {
   return !plugin[NuxtPluginIndicator]
 }
 
-let currentNuxtAppInstance: NuxtApp | null
-
-export const setNuxtAppInstance = (nuxt: NuxtApp | null) => {
-  currentNuxtAppInstance = nuxt
-}
-
 /**
  * Ensures that the setup function passed in has access to the Nuxt instance via `useNuxt`.
  *
@@ -184,13 +182,14 @@ export const setNuxtAppInstance = (nuxt: NuxtApp | null) => {
  * @param setup The function to call
  */
 export function callWithNuxt<T extends (...args: any[]) => any> (nuxt: NuxtApp | _NuxtApp, setup: T, args?: Parameters<T>) {
-  setNuxtAppInstance(nuxt as NuxtApp)
-  const p: ReturnType<T> = args ? setup(...args as Parameters<T>) : setup()
+  const fn = () => args ? setup(...args as Parameters<T>) : setup()
   if (process.server) {
-    // Unset nuxt instance to prevent context-sharing in server-side
-    setNuxtAppInstance(null)
+    return nuxtAppCtx.callAsync<ReturnType<T>>(nuxt, fn)
+  } else {
+    // In client side we could assume nuxt app is singleton
+    nuxtAppCtx.set(nuxt)
+    return fn()
   }
-  return p
 }
 
 /**
@@ -200,10 +199,11 @@ export function useNuxtApp () {
   const vm = getCurrentInstance()
 
   if (!vm) {
-    if (!currentNuxtAppInstance) {
+    const nuxtAppInstance = nuxtAppCtx.use()
+    if (!nuxtAppInstance) {
       throw new Error('nuxt instance unavailable')
     }
-    return currentNuxtAppInstance
+    return nuxtAppInstance
   }
 
   return vm.appContext.app.$nuxt as NuxtApp
diff --git a/packages/nuxt3/src/auto-imports/presets.ts b/packages/nuxt3/src/auto-imports/presets.ts
index 8c5c7bb53a1..62e4a76af2e 100644
--- a/packages/nuxt3/src/auto-imports/presets.ts
+++ b/packages/nuxt3/src/auto-imports/presets.ts
@@ -23,6 +23,7 @@ export const appPreset = defineUnimportPreset({
   imports: [
     'useAsyncData',
     'useLazyAsyncData',
+    'refreshNuxtData',
     'defineNuxtComponent',
     'useNuxtApp',
     'defineNuxtPlugin',
diff --git a/packages/nuxt3/src/core/nitro-nitropack.ts b/packages/nuxt3/src/core/nitro-nitropack.ts
index 7ee8b07d696..bc481f1c5c7 100644
--- a/packages/nuxt3/src/core/nitro-nitropack.ts
+++ b/packages/nuxt3/src/core/nitro-nitropack.ts
@@ -24,9 +24,11 @@ export async function initNitro (nuxt: Nuxt) {
       private: nuxt.options.privateRuntimeConfig
     },
     output: {
-      dir: nuxt.options.dev
-        ? join(nuxt.options.buildDir, 'nitro')
-        : resolve(nuxt.options.rootDir, '.output')
+      dir: nitroOptions.output?.dir || (
+        nuxt.options.dev
+          ? join(nuxt.options.buildDir, 'nitro')
+          : resolve(nuxt.options.rootDir, '.output')
+      )
     },
     dev: nuxt.options.dev,
     preset: nuxt.options.dev ? 'dev' : undefined
diff --git a/packages/nuxt3/src/core/nuxt.ts b/packages/nuxt3/src/core/nuxt.ts
index 3730b77b9e8..0f610d8a803 100644
--- a/packages/nuxt3/src/core/nuxt.ts
+++ b/packages/nuxt3/src/core/nuxt.ts
@@ -12,6 +12,7 @@ import autoImportsModule from '../auto-imports/module'
 import { distDir, pkgDir } from '../dirs'
 import { version } from '../../package.json'
 import { ImportProtectionPlugin, vueAppPatterns } from './plugins/import-protection'
+import { UnctxTransformPlugin } from './plugins/unctx'
 import { addModuleTranspiles } from './modules'
 
 export function createNuxt (options: NuxtOptions): Nuxt {
@@ -57,7 +58,6 @@ async function initNuxt (nuxt: Nuxt) {
   })
 
   // Add import protection
-
   const config = {
     rootDir: nuxt.options.rootDir,
     patterns: vueAppPatterns(nuxt)
@@ -65,6 +65,10 @@ async function initNuxt (nuxt: Nuxt) {
   addVitePlugin(ImportProtectionPlugin.vite(config))
   addWebpackPlugin(ImportProtectionPlugin.webpack(config))
 
+  // Add unctx transform
+  addVitePlugin(UnctxTransformPlugin(nuxt).vite())
+  addWebpackPlugin(UnctxTransformPlugin(nuxt).webpack())
+
   // Init user modules
   await nuxt.callHook('modules:before', { nuxt } as ModuleContainer)
   const modulesToInstall = [
diff --git a/packages/nuxt3/src/core/plugins/unctx.ts b/packages/nuxt3/src/core/plugins/unctx.ts
new file mode 100644
index 00000000000..036d21c6771
--- /dev/null
+++ b/packages/nuxt3/src/core/plugins/unctx.ts
@@ -0,0 +1,31 @@
+import { Nuxt, NuxtApp, NuxtMiddleware } from '@nuxt/schema'
+import { createTransformer } from 'unctx/transform'
+import { createUnplugin } from 'unplugin'
+
+export const UnctxTransformPlugin = (nuxt: Nuxt) => {
+  const transformer = createTransformer({
+    asyncFunctions: ['defineNuxtPlugin', 'defineNuxtRouteMiddleware']
+  })
+
+  let app: NuxtApp | undefined
+  let middleware: NuxtMiddleware[] = []
+  nuxt.hook('app:resolve', (_app) => { app = _app })
+  nuxt.hook('pages:middleware:extend', (_middlewares) => { middleware = _middlewares })
+
+  return createUnplugin(() => ({
+    name: 'unctx:transfrom',
+    enforce: 'post',
+    transformInclude (id) {
+      return Boolean(app?.plugins.find(i => i.src === id) || middleware.find(m => m.path === id))
+    },
+    transform (code, id) {
+      const result = transformer.transform(code)
+      if (result) {
+        return {
+          code: result.code,
+          map: result.magicString.generateMap({ source: id, includeContent: true })
+        }
+      }
+    }
+  }))
+}
diff --git a/packages/nuxt3/src/core/templates.ts b/packages/nuxt3/src/core/templates.ts
index 5ff36cc59a6..99995fa393d 100644
--- a/packages/nuxt3/src/core/templates.ts
+++ b/packages/nuxt3/src/core/templates.ts
@@ -80,7 +80,7 @@ export const appViewTemplate = {
   {{ HEAD }}
 </head>
 
-<body {{ BODY_ATTRS }}>
+<body {{ BODY_ATTRS }}>{{ BODY_PREPEND }}
   {{ APP }}
 </body>
 
diff --git a/packages/schema/package.json b/packages/schema/package.json
index 85e323ec3de..928f06026f7 100644
--- a/packages/schema/package.json
+++ b/packages/schema/package.json
@@ -27,7 +27,7 @@
     "postcss-import-resolver": "^2.0.0",
     "scule": "^0.2.1",
     "std-env": "^3.0.1",
-    "ufo": "^0.8.1",
+    "ufo": "^0.8.3",
     "unimport": "^0.1.3"
   },
   "engines": {
diff --git a/packages/schema/src/config/_app.ts b/packages/schema/src/config/_app.ts
index 2fcbe139aae..2e69bdc0229 100644
--- a/packages/schema/src/config/_app.ts
+++ b/packages/schema/src/config/_app.ts
@@ -3,7 +3,11 @@ import { existsSync, readdirSync } from 'fs'
 import defu from 'defu'
 
 export default {
-  /** Vue.js config */
+  /**
+   * Vue.js config
+   * @version 2
+   * @version 3
+   */
   vue: {
     /**
      * Properties that will be set directly on `Vue.config` for vue@2.
diff --git a/packages/schema/src/config/build.ts b/packages/schema/src/config/build.ts
index ba29cb03c7b..efab93b7f90 100644
--- a/packages/schema/src/config/build.ts
+++ b/packages/schema/src/config/build.ts
@@ -8,6 +8,7 @@ export default {
    * The builder to use for bundling the Vue part of your application.
    *
    * @type {'vite' | 'webpack' | { bundle: (nuxt: typeof import('../src/types/nuxt').Nuxt) => Promise<void> }}
+   * @version 3
    */
   builder: {
     $resolve: (val, get) => {
@@ -21,17 +22,21 @@ export default {
       return map[val] || (get('vite') === false ? map.webpack : map.vite)
     },
   },
-
-  build: {
-    /**
-   * Suppresses most of the build output log.
-   *
-   * It is enabled by default when a CI or test environment is detected.
-   *
-   * @see [std-env](https://github.com/unjs/std-env)
+  /**
+   * Shared build configuration.
    * @version 2
    * @version 3
    */
+  build: {
+    /**
+     * Suppresses most of the build output log.
+     *
+     * It is enabled by default when a CI or test environment is detected.
+     *
+     * @see [std-env](https://github.com/unjs/std-env)
+     * @version 2
+     * @version 3
+     */
     quiet: Boolean(isCI || isTest),
 
     /**
diff --git a/packages/schema/src/config/experimental.ts b/packages/schema/src/config/experimental.ts
index a289fca2bfa..947fe7b9479 100644
--- a/packages/schema/src/config/experimental.ts
+++ b/packages/schema/src/config/experimental.ts
@@ -1,22 +1,22 @@
 export default {
-  /**
-   * Set to true to generate an async entrypoint for the Vue bundle (for module federation support).
-   * @version 3
-   */
-  asyncEntry: {
-    $resolve: (val, get) => val ?? (get('dev') && get('experimental.viteNode')) ?? false
-  },
+  /** @version 3 */
+  experimental: {
+    /**
+     * Set to true to generate an async entrypoint for the Vue bundle (for module federation support).
+     */
+    asyncEntry: {
+      $resolve: (val, get) => val ?? (get('dev') && get('experimental.viteNode')) ?? false
+    },
 
-  /**
-   * Use vite-node for on-demand server chunk loading
-   * @version 3
-   */
-  viteNode: process.env.EXPERIMENTAL_VITE_NODE ? true : false,
+    /**
+     * Use vite-node for on-demand server chunk loading
+     */
+    viteNode: process.env.EXPERIMENTAL_VITE_NODE ? true : false,
 
-  /**
-   * Enable Vue's reactivity transform
-   * @see https://vuejs.org/guide/extras/reactivity-transform.html
-   * @version 3
-   */
-  reactivityTransform: false
+    /**
+     * Enable Vue's reactivity transform
+     * @see https://vuejs.org/guide/extras/reactivity-transform.html
+     */
+    reactivityTransform: false
+  }
 }
diff --git a/packages/schema/src/config/index.ts b/packages/schema/src/config/index.ts
index a3184b48aea..adeb87e0978 100644
--- a/packages/schema/src/config/index.ts
+++ b/packages/schema/src/config/index.ts
@@ -45,6 +45,7 @@ export default {
   ...vite,
   ...webpack,
   ...nitro,
+  ...experimental,
   // Legacy
   ...build,
   messages,
@@ -53,5 +54,4 @@ export default {
   server,
   cli,
   generate,
-  experimental,
 }
diff --git a/packages/schema/src/config/nitro.ts b/packages/schema/src/config/nitro.ts
index 87f4238945d..7b3257dd859 100644
--- a/packages/schema/src/config/nitro.ts
+++ b/packages/schema/src/config/nitro.ts
@@ -1,11 +1,12 @@
-/**
- * @version 3
- */
 export default {
   experimentNitropack: process.env.EXPERIMENT_NITROPACK ? true : false,
 
   /**
+   * Configuration for Nuxt Nitro.
+   *
    * @typedef {Awaited<ReturnType<typeof import('nitropack')['NitroConfig']>>}
+   * @version 2
+   * @version 3
   */
   nitro: {}
 }
diff --git a/packages/schema/src/config/router.ts b/packages/schema/src/config/router.ts
index e8dae2aa3d6..3b5176de934 100644
--- a/packages/schema/src/config/router.ts
+++ b/packages/schema/src/config/router.ts
@@ -9,7 +9,7 @@ export default {
    * For more control, you can use `app/router.optionts.ts` file.
    *
    * @see [documentation](https://router.vuejs.org/api/#routeroptions)
-   * @type {import('../src/types/router').RouterConfigOptions}
+   * @type {import('../src/types/router').RouterConfigSerializable}
    *
    * @version 3
    */
diff --git a/packages/schema/src/config/typescript.ts b/packages/schema/src/config/typescript.ts
index 7d4c34c32f4..1fa89a4bf53 100644
--- a/packages/schema/src/config/typescript.ts
+++ b/packages/schema/src/config/typescript.ts
@@ -1,4 +1,10 @@
 export default {
+  /**
+   * Configuration for Nuxt's TypeScript integration.
+   *
+   * @version 2
+   * @version 3
+   */
   typescript: {
     /**
    * TypeScript comes with certain checks to give you more safety and analysis of your program.
diff --git a/packages/schema/src/types/router.ts b/packages/schema/src/types/router.ts
index a5cb900c0c4..03e0fabdc8b 100644
--- a/packages/schema/src/types/router.ts
+++ b/packages/schema/src/types/router.ts
@@ -1,9 +1,16 @@
 import type { RouterOptions as _RouterOptions  } from 'vue-router'
 
 
-export type RouterOptions = Exclude<_RouterOptions, 'history' | 'routes'>
+export type RouterConfig = Partial<Omit<_RouterOptions, 'history' | 'routes'>>
+
+/** @deprecated Use RouterConfig instead */
+export type RouterOptions = RouterConfig
 
 /**
  * Only JSON serializable router options are configurable from nuxt config
  */
-export type RouterConfigOptions = Pick<RouterOptions, 'linkActiveClass' | 'linkExactActiveClass' | 'end' | 'sensitive' | 'strict'>
+export type RouterConfigSerializable = Pick<RouterConfig, 'linkActiveClass' | 'linkExactActiveClass' | 'end' | 'sensitive' | 'strict'>
+
+
+/** @deprecated Use RouterConfigSerializable instead */
+export type RouterConfigOptions = RouterConfigSerializable
diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json
index 7491da362c5..840c35a2a46 100644
--- a/packages/test-utils/package.json
+++ b/packages/test-utils/package.json
@@ -22,9 +22,9 @@
     "ohmyfetch": "^0.4.15"
   },
   "devDependencies": {
-    "playwright": "^1.20.1",
+    "playwright": "^1.20.2",
     "unbuild": "latest",
-    "vitest": "^0.7.11"
+    "vitest": "^0.8.4"
   },
   "peerDependencies": {
     "vue": "3.2.31"
diff --git a/packages/test-utils/src/context.ts b/packages/test-utils/src/context.ts
index 5f3faad37df..d203f865b49 100644
--- a/packages/test-utils/src/context.ts
+++ b/packages/test-utils/src/context.ts
@@ -12,8 +12,8 @@ export function createTestContext (options: Partial<TestOptions>): TestContext {
     setupTimeout: 60000,
     dev: !!JSON.parse(process.env.NUXT_TEST_DEV || 'false'),
     logLevel: 1,
-    server: options.browser,
-    build: options.browser || options.server,
+    server: true,
+    build: (options.browser !== false) || (options.server !== false),
     nuxtConfig: {},
     // TODO: auto detect based on process.env
     runner: <TestRunner>'vitest',
diff --git a/packages/vite/package.json b/packages/vite/package.json
index 5a909cf62af..aaa95d7a37c 100644
--- a/packages/vite/package.json
+++ b/packages/vite/package.json
@@ -20,13 +20,13 @@
   },
   "dependencies": {
     "@nuxt/kit": "3.0.0",
-    "@vitejs/plugin-vue": "^2.2.4",
-    "@vitejs/plugin-vue-jsx": "^1.3.8",
+    "@vitejs/plugin-vue": "^2.3.1",
+    "@vitejs/plugin-vue-jsx": "^1.3.9",
     "autoprefixer": "^10.4.4",
     "chokidar": "^3.5.3",
-    "cssnano": "^5.1.5",
+    "cssnano": "^5.1.7",
     "defu": "^6.0.0",
-    "esbuild": "^0.14.27",
+    "esbuild": "^0.14.31",
     "escape-string-regexp": "^5.0.0",
     "externality": "^0.2.1",
     "fs-extra": "^10.0.1",
@@ -41,10 +41,10 @@
     "postcss-url": "^10.1.3",
     "rollup": "^2.70.1",
     "rollup-plugin-visualizer": "^5.6.0",
-    "ufo": "^0.8.1",
-    "unplugin": "^0.6.0",
-    "vite": "^2.8.6",
-    "vite-node": "^0.7.11"
+    "ufo": "^0.8.3",
+    "unplugin": "^0.6.1",
+    "vite": "^2.9.1",
+    "vite-node": "^0.8.4"
   },
   "peerDependencies": {
     "vue": "3.2.31"
diff --git a/packages/vite/src/client.ts b/packages/vite/src/client.ts
index 62ef9ccbf75..f756868601f 100644
--- a/packages/vite/src/client.ts
+++ b/packages/vite/src/client.ts
@@ -11,7 +11,7 @@ import { wpfs } from './utils/wpfs'
 import type { ViteBuildContext, ViteOptions } from './vite'
 import { writeManifest } from './manifest'
 import { devStyleSSRPlugin } from './plugins/dev-ssr-css'
-import { DynamicBasePlugin, RelativeAssetPlugin } from './plugins/dynamic-base'
+import { RelativeAssetPlugin } from './plugins/dynamic-base'
 import { viteNodePlugin } from './vite-node'
 
 export async function buildClient (ctx: ViteBuildContext) {
@@ -41,7 +41,6 @@ export async function buildClient (ctx: ViteBuildContext) {
       cacheDirPlugin(ctx.nuxt.options.rootDir, 'client'),
       vuePlugin(ctx.config.vue),
       viteJsxPlugin(),
-      DynamicBasePlugin.vite({ env: 'client', devAppConfig: ctx.nuxt.options.app }),
       RelativeAssetPlugin(),
       devStyleSSRPlugin({
         rootDir: ctx.nuxt.options.rootDir,
diff --git a/packages/vite/src/plugins/dynamic-base.ts b/packages/vite/src/plugins/dynamic-base.ts
index 7fbd1775989..1d6008ad021 100644
--- a/packages/vite/src/plugins/dynamic-base.ts
+++ b/packages/vite/src/plugins/dynamic-base.ts
@@ -4,8 +4,6 @@ import type { Plugin } from 'vite'
 import MagicString from 'magic-string'
 
 interface DynamicBasePluginOptions {
-  env: 'dev' | 'server' | 'client'
-  devAppConfig?: Record<string, any>
   globalPublicPath?: string
 }
 
@@ -18,6 +16,15 @@ export const RelativeAssetPlugin = function (): Plugin {
 
       for (const file in bundle) {
         const asset = bundle[file]
+        if (asset.fileName.includes('legacy') && asset.type === 'chunk' && asset.code.includes('innerHTML')) {
+          for (const delimiter of ['`', '"', "'"]) {
+            asset.code = asset.code.replace(
+              new RegExp(`(?<=innerHTML=)${delimiter}([^${delimiter}]*)\\/__NUXT_BASE__\\/([^${delimiter}]*)${delimiter}`, 'g'),
+              /* eslint-disable-next-line no-template-curly-in-string */
+              '`$1${(window?.__NUXT__?.config.app.cdnURL || window?.__NUXT__?.config.app.baseURL) + window?.__NUXT__?.config.app.buildAssetsDir.slice(1)}$2`'
+            )
+          }
+        }
         if (asset.type === 'asset' && typeof asset.source === 'string' && asset.fileName.endsWith('.css')) {
           const depth = file.split('/').length - 1
           const assetBase = depth === 0 ? '.' : Array.from({ length: depth }).map(() => '..').join('/')
@@ -33,7 +40,7 @@ export const RelativeAssetPlugin = function (): Plugin {
 
 const VITE_ASSET_RE = /^export default ["'](__VITE_ASSET.*)["']$/
 
-export const DynamicBasePlugin = createUnplugin(function (options: DynamicBasePluginOptions) {
+export const DynamicBasePlugin = createUnplugin(function (options: DynamicBasePluginOptions = {}) {
   return {
     name: 'nuxt:dynamic-base-path',
     resolveId (id) {
@@ -75,10 +82,10 @@ export const DynamicBasePlugin = createUnplugin(function (options: DynamicBasePl
       s.replace(/from *['"]\/__NUXT_BASE__(\/[^'"]*)['"]/g, 'from "$1"')
 
       // Dynamically compute string URLs featuring baseURL
-      for (const delimiter of ['`', '"', "'"]) {
-        const delimiterRE = new RegExp(`(?<!const base = )${delimiter}([^${delimiter}]*)\\/__NUXT_BASE__\\/([^${delimiter}]*)${delimiter}`, 'g')
+      for (const delimiter of ['`', "'", '"']) {
+        const delimiterRE = new RegExp(`(?<!(const base = |from *))${delimiter}([^${delimiter}]*)\\/__NUXT_BASE__\\/([^${delimiter}]*)${delimiter}`, 'g')
         /* eslint-disable-next-line no-template-curly-in-string */
-        s.replace(delimiterRE, '`$1${__publicAssetsURL()}$2`')
+        s.replace(delimiterRE, r => '`' + r.replace(/\/__NUXT_BASE__\//g, '${__publicAssetsURL()}').slice(1, -1) + '`')
       }
 
       if (s.hasChanged()) {
diff --git a/packages/vite/src/runtime/server.mjs b/packages/vite/src/runtime/server.mjs
index 3d043027752..83b7c956e61 100644
--- a/packages/vite/src/runtime/server.mjs
+++ b/packages/vite/src/runtime/server.mjs
@@ -3,12 +3,13 @@ import { fileURLToPath } from 'url'
 import { ViteNodeRunner } from 'vite-node/client'
 import { dirname, join } from 'pathe'
 
-const entry = '__NUXT_SERVER_ENTRY__'
-const url = '__NUXT_SERVER_FETCH_URL__'
-const base = '__NUXT_SERVER_BASE__'
+const url = process.env.NUXT_VITE_SERVER_FETCH
+const entry = process.env.NUXT_VITE_SERVER_ENTRY
+const base = process.env.NUXT_VITE_SERVER_BASE
+const root = process.env.NUXT_VITE_SERVER_ROOT
 
 const runner = new ViteNodeRunner({
-  root: process.cwd(),
+  root,
   base,
   async fetchModule (id) {
     return await $fetch(url, {
@@ -23,13 +24,15 @@ function isCSS (file) {
   return IS_CSS_RE.test(file)
 }
 
-async function writeManifest (extraEntries) {
+async function writeManifest () {
   const dir = dirname(fileURLToPath(import.meta.url))
 
   const entries = [
     '@vite/client',
     'entry.mjs',
-    ...extraEntries
+    ...Array.from(runner.moduleCache.keys())
+      .filter(i => runner.moduleCache.get(i).exports && isCSS(i))
+      .map(i => i.slice(1))
   ]
 
   const clientManifest = {
@@ -44,11 +47,14 @@ async function writeManifest (extraEntries) {
   await fs.writeFile(join(dir, 'client.manifest.mjs'), 'export default ' + JSON.stringify(clientManifest, null, 2), 'utf8')
 }
 
+let render
+
 export default async (ssrContext) => {
-  const { default: render } = await runner.executeFile(entry)
+  // Workaround for stub mode
+  // https://github.com/nuxt/framework/pull/3983
+  process.server = true
+  render = render || (await runner.executeFile(entry)).default
   const result = await render(ssrContext)
-  const modules = Array.from(runner.moduleCache.keys())
-  // Write CSS modules intro manifest to prevent FOUC
-  await writeManifest(modules.filter(i => isCSS(i)).map(i => i.slice(1)))
+  await writeManifest()
   return result
 }
diff --git a/packages/vite/src/server.ts b/packages/vite/src/server.ts
index 539e1b6c13f..e606c74bfd6 100644
--- a/packages/vite/src/server.ts
+++ b/packages/vite/src/server.ts
@@ -10,7 +10,6 @@ import { ViteBuildContext, ViteOptions } from './vite'
 import { wpfs } from './utils/wpfs'
 import { cacheDirPlugin } from './plugins/cache-dir'
 import { prepareDevServerEntry } from './vite-node'
-import { DynamicBasePlugin } from './plugins/dynamic-base'
 import { isCSS, isDirectory, readDirRecursively } from './utils'
 import { bundleRequest } from './dev-bundler'
 import { writeManifest } from './manifest'
@@ -76,7 +75,6 @@ export async function buildServer (ctx: ViteBuildContext) {
     plugins: [
       cacheDirPlugin(ctx.nuxt.options.rootDir, 'server'),
       vuePlugin(ctx.config.vue),
-      DynamicBasePlugin.vite({ env: ctx.nuxt.options.dev ? 'dev' : 'server', devAppConfig: ctx.nuxt.options.app }),
       viteJsxPlugin()
     ]
   } as ViteOptions)
diff --git a/packages/vite/src/vite-node.ts b/packages/vite/src/vite-node.ts
index 0b4198df819..f0e0daae303 100644
--- a/packages/vite/src/vite-node.ts
+++ b/packages/vite/src/vite-node.ts
@@ -62,18 +62,18 @@ export async function prepareDevServerEntry (ctx: ViteBuildContext) {
     entryPath = resolve(ctx.nuxt.options.appDir, 'entry.async')
   }
 
-  const raw = await fse.readFile(resolve(distDir, 'runtime/server.mjs'), 'utf-8')
   const host = ctx.nuxt.options.server.host || 'localhost'
   const port = ctx.nuxt.options.server.port || '3000'
   const protocol = ctx.nuxt.options.server.https ? 'https' : 'http'
-  const code = raw
-    .replace('__NUXT_SERVER_FETCH_URL__', `${protocol}://${host}:${port}/__nuxt_vite_node__/`)
-    .replace('__NUXT_SERVER_ENTRY__', entryPath)
-    .replace('__NUXT_SERVER_BASE__', ctx.ssrServer.config.base || '/_nuxt/')
-  await fse.writeFile(
-    resolve(ctx.nuxt.options.buildDir, 'dist/server/server.mjs'),
-    code,
-    'utf-8'
+
+  process.env.NUXT_VITE_SERVER_FETCH = `${protocol}://${host}:${port}/__nuxt_vite_node__/`
+  process.env.NUXT_VITE_SERVER_ENTRY = entryPath
+  process.env.NUXT_VITE_SERVER_BASE = ctx.ssrServer.config.base || '/_nuxt/'
+  process.env.NUXT_VITE_SERVER_ROOT = ctx.nuxt.options.rootDir
+
+  await fse.copyFile(
+    resolve(distDir, 'runtime/server.mjs'),
+    resolve(ctx.nuxt.options.buildDir, 'dist/server/server.mjs')
   )
 }
 
diff --git a/packages/vite/src/vite.ts b/packages/vite/src/vite.ts
index e41c21913b3..08ae5f8849d 100644
--- a/packages/vite/src/vite.ts
+++ b/packages/vite/src/vite.ts
@@ -9,6 +9,7 @@ import { getPort } from 'get-port-please'
 import { buildClient } from './client'
 import { buildServer } from './server'
 import virtual from './plugins/virtual'
+import { DynamicBasePlugin } from './plugins/dynamic-base'
 import { warmupViteServer } from './utils/warmup'
 import { resolveCSSOptions } from './css'
 
@@ -25,7 +26,6 @@ export interface ViteBuildContext {
 }
 
 export async function bundle (nuxt: Nuxt) {
-  // TODO: After nitropack refactor, try if we can resuse the same server port as Nuxt
   const hmrPortDefault = 24678 // Vite's default HMR port
   const hmrPort = await getPort({
     port: hmrPortDefault,
@@ -53,7 +53,8 @@ export async function bundle (nuxt: Nuxt) {
         optimizeDeps: {
           entries: [
             resolve(nuxt.options.appDir, 'entry.ts')
-          ]
+          ],
+          include: ['vue']
         },
         css: resolveCSSOptions(nuxt),
         build: {
@@ -63,7 +64,8 @@ export async function bundle (nuxt: Nuxt) {
           }
         },
         plugins: [
-          virtual(nuxt.vfs)
+          virtual(nuxt.vfs),
+          DynamicBasePlugin.vite()
         ],
         vue: {
           reactivityTransform: nuxt.options.experimental.reactivityTransform
diff --git a/packages/webpack/package.json b/packages/webpack/package.json
index 0d6d1d453bd..cb5cb36f455 100644
--- a/packages/webpack/package.json
+++ b/packages/webpack/package.json
@@ -22,7 +22,7 @@
     "autoprefixer": "^10.4.4",
     "css-loader": "^6.7.1",
     "css-minimizer-webpack-plugin": "^3.4.1",
-    "cssnano": "^5.1.5",
+    "cssnano": "^5.1.7",
     "esbuild-loader": "^2.18.0",
     "escape-string-regexp": "^5.0.0",
     "file-loader": "^6.2.0",
@@ -41,12 +41,12 @@
     "postcss-url": "^10.1.3",
     "style-resources-loader": "^1.5.0",
     "time-fix-plugin": "^2.0.7",
-    "ufo": "^0.8.1",
-    "unplugin": "^0.6.0",
+    "ufo": "^0.8.3",
+    "unplugin": "^0.6.1",
     "url-loader": "^4.1.1",
     "vue-loader": "^17.0.0",
     "vue-style-loader": "^4.1.3",
-    "webpack": "^5.70.0",
+    "webpack": "^5.71.0",
     "webpack-bundle-analyzer": "^4.5.0",
     "webpack-dev-middleware": "^5.3.1",
     "webpack-hot-middleware": "^2.25.1",
diff --git a/packages/webpack/src/webpack.ts b/packages/webpack/src/webpack.ts
index 01de8b52596..cf25c4f329b 100644
--- a/packages/webpack/src/webpack.ts
+++ b/packages/webpack/src/webpack.ts
@@ -34,8 +34,6 @@ export async function bundle (nuxt: Nuxt) {
   // Configure compilers
   const compilers = webpackConfigs.map((config) => {
     config.plugins.push(DynamicBasePlugin.webpack({
-      env: nuxt.options.dev ? 'dev' : config.name as 'client',
-      devAppConfig: nuxt.options.app,
       globalPublicPath: '__webpack_public_path__'
     }))
 
diff --git a/playground/app.vue b/playground/app.vue
index 89f65806838..c93a9dcaf5f 100644
--- a/playground/app.vue
+++ b/playground/app.vue
@@ -1,30 +1,12 @@
+<script setup lang="ts">
+</script>
+
 <template>
-  <div class="app">
-    <img src="./assets/logo.svg" class="h-20 mb-4">
-    <h1 class="greeting">
-      {{ hello }}, <br>Nuxt 3!
-    </h1>
+  <!-- Edit this file to play around with Nuxt but never commit changes! -->
+  <div>
+    Nuxt 3 Playground
   </div>
 </template>
 
-<script setup>
-const greetings = [
-  'Hello',
-  'Hi',
-  'Salut',
-  'こんにちは',
-  '你好'
-]
-const hello = useState('hello', () => greetings[Math.random() * greetings.length | 0])
-</script>
-
 <style scoped>
-.app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  padding: 1rem 1.5rem;
-}
-.greeting {
-  font-size: 4em;
-  font-weight: 400;
-}
 </style>
diff --git a/playground/nuxt.config.ts b/playground/nuxt.config.ts
index aec3a1ce8c5..a3e4d68096a 100644
--- a/playground/nuxt.config.ts
+++ b/playground/nuxt.config.ts
@@ -1,10 +1,4 @@
 import { defineNuxtConfig } from 'nuxt3'
 
 export default defineNuxtConfig({
-  modules: [
-    '@nuxt/ui'
-  ],
-  experimental: {
-    viteNode: true
-  }
 })
diff --git a/playground/package.json b/playground/package.json
index 417fe444d8a..d6e042fc391 100644
--- a/playground/package.json
+++ b/playground/package.json
@@ -2,7 +2,6 @@
   "name": "nuxt-playground",
   "private": true,
   "devDependencies": {
-    "@nuxt/ui": "npm:@nuxt/ui-edge@latest",
     "nuxt3": "latest"
   },
   "scripts": {
diff --git a/renovate.json b/renovate.json
index c6dd8986c4e..4951afde851 100644
--- a/renovate.json
+++ b/renovate.json
@@ -15,6 +15,7 @@
     "@docus/github",
     "@docus/social-image",
     "@docus/theme",
-    "@docus/twitter"
+    "@docus/twitter",
+    "h3"
   ]
 }
diff --git a/test/basic.test.ts b/test/basic.test.ts
index 36fbdc7c2c8..1d2058482c2 100644
--- a/test/basic.test.ts
+++ b/test/basic.test.ts
@@ -40,8 +40,6 @@ describe('pages', () => {
     // composables auto import
     expect(html).toContain('Composable | foo: auto imported from ~/components/foo.ts')
     expect(html).toContain('Composable | bar: auto imported from ~/components/useBar.ts')
-    // plugins
-    expect(html).toContain('Plugin | myPlugin: Injected by my-plugin')
     // should import components
     expect(html).toContain('This is a custom component with a named export.')
   })
@@ -146,6 +144,18 @@ describe('middlewares', () => {
   })
 })
 
+describe('plugins', () => {
+  it('basic plugin', async () => {
+    const html = await $fetch('/plugins')
+    expect(html).toContain('myPlugin: Injected by my-plugin')
+  })
+
+  it('async plugin', async () => {
+    const html = await $fetch('/plugins')
+    expect(html).toContain('asyncPlugin: Async plugin works! 123')
+  })
+})
+
 describe('layouts', () => {
   it('should apply custom layout', async () => {
     const html = await $fetch('/with-layout')
diff --git a/test/bridge.test.ts b/test/bridge.test.ts
index b911aa9f4c3..995a4b845ee 100644
--- a/test/bridge.test.ts
+++ b/test/bridge.test.ts
@@ -1,6 +1,6 @@
 import { fileURLToPath } from 'url'
 import { describe, expect, it } from 'vitest'
-import { setup, $fetch } from '@nuxt/test-utils'
+import { setup, $fetch, startServer } from '@nuxt/test-utils'
 
 describe('fixtures:bridge', async () => {
   await setup({
@@ -23,4 +23,60 @@ describe('fixtures:bridge', async () => {
       expect(html).toContain('Hello Vue 2!')
     })
   })
+
+  describe('dynamic paths', () => {
+    if (process.env.TEST_WITH_WEBPACK) {
+      // TODO:
+      it.todo('work with webpack')
+      return
+    }
+    it('should work with no overrides', async () => {
+      const html = await $fetch('/assets')
+      for (const match of html.matchAll(/(href|src)="(.*?)"/g)) {
+        const url = match[2]
+        expect(url.startsWith('/_nuxt/') || url === '/public.svg').toBeTruthy()
+      }
+    })
+
+    it('adds relative paths to CSS', async () => {
+      const html = await $fetch('/assets')
+      const urls = Array.from(html.matchAll(/(href|src)="(.*?)"/g)).map(m => m[2])
+      const cssURL = urls.find(u => /_nuxt\/assets.*\.css$/.test(u))
+      const css = await $fetch(cssURL)
+      const imageUrls = Array.from(css.matchAll(/url\(([^)]*)\)/g)).map(m => m[1].replace(/[-.][\w]{8}\./g, '.'))
+      expect(imageUrls).toMatchInlineSnapshot(`
+        [
+          "./logo.svg",
+          "../public.svg",
+        ]
+      `)
+    })
+
+    it('should allow setting base URL and build assets directory', async () => {
+      process.env.NUXT_APP_BUILD_ASSETS_DIR = '/_other/'
+      process.env.NUXT_APP_BASE_URL = '/foo/'
+      await startServer()
+
+      const html = await $fetch('/assets')
+      for (const match of html.matchAll(/(href|src)="(.*?)"/g)) {
+        const url = match[2]
+        // TODO: should be /foo/public.svg
+        expect(url.startsWith('/foo/_other/') || url === '/public.svg').toBeTruthy()
+      }
+    })
+
+    it('should allow setting CDN URL', async () => {
+      process.env.NUXT_APP_BASE_URL = '/foo/'
+      process.env.NUXT_APP_CDN_URL = 'https://example.com/'
+      process.env.NUXT_APP_BUILD_ASSETS_DIR = '/_cdn/'
+      await startServer()
+
+      const html = await $fetch('/assets')
+      for (const match of html.matchAll(/(href|src)="(.*?)"/g)) {
+        const url = match[2]
+        // TODO: should be https://example.com/public.svg
+        expect(url.startsWith('https://example.com/_cdn/') || url === '/public.svg').toBeTruthy()
+      }
+    })
+  })
 })
diff --git a/test/fixtures/basic/middleware/redirect.global.ts b/test/fixtures/basic/middleware/redirect.global.ts
index 9d7f4fe5416..1c926d193ea 100644
--- a/test/fixtures/basic/middleware/redirect.global.ts
+++ b/test/fixtures/basic/middleware/redirect.global.ts
@@ -1,5 +1,6 @@
-export default defineNuxtRouteMiddleware((to) => {
+export default defineNuxtRouteMiddleware(async (to) => {
   if (to.path.startsWith('/redirect/')) {
+    await new Promise(resolve => setTimeout(resolve, 100))
     return navigateTo(to.path.slice('/redirect/'.length - 1))
   }
 })
diff --git a/test/fixtures/basic/pages/index.vue b/test/fixtures/basic/pages/index.vue
index b5f9c05ae25..f4de47d7162 100644
--- a/test/fixtures/basic/pages/index.vue
+++ b/test/fixtures/basic/pages/index.vue
@@ -7,7 +7,6 @@
     <div>RuntimeConfig | testConfig: {{ config.testConfig }}</div>
     <div>Composable | foo: {{ foo }}</div>
     <div>Composable | bar: {{ bar }}</div>
-    <div>Plugin | myPlugin: {{ $myPlugin() }}</div>
     <NuxtLink to="/">
       Link
     </NuxtLink>
diff --git a/test/fixtures/basic/pages/plugins.vue b/test/fixtures/basic/pages/plugins.vue
new file mode 100644
index 00000000000..1b8a0285c17
--- /dev/null
+++ b/test/fixtures/basic/pages/plugins.vue
@@ -0,0 +1,6 @@
+<template>
+  <div>
+    <div>myPlugin: {{ $myPlugin() }}</div>
+    <div>asyncPlugin: {{ $asyncPlugin() }}</div>
+  </div>
+</template>
diff --git a/test/fixtures/basic/plugins/async-plugin.ts b/test/fixtures/basic/plugins/async-plugin.ts
new file mode 100644
index 00000000000..dd5d9106a56
--- /dev/null
+++ b/test/fixtures/basic/plugins/async-plugin.ts
@@ -0,0 +1,12 @@
+export default defineNuxtPlugin(async (/* nuxtApp */) => {
+  const config1 = useRuntimeConfig()
+  await new Promise(resolve => setTimeout(resolve, 100))
+  const config2 = useRuntimeConfig()
+  return {
+    provide: {
+      asyncPlugin: () => config1 && config1 === config2
+        ? 'Async plugin works! ' + config1.testConfig
+        : 'Async plugin failed!'
+    }
+  }
+})
diff --git a/playground/assets/logo.svg b/test/fixtures/bridge/assets/logo.svg
similarity index 100%
rename from playground/assets/logo.svg
rename to test/fixtures/bridge/assets/logo.svg
diff --git a/test/fixtures/bridge/pages/assets.vue b/test/fixtures/bridge/pages/assets.vue
new file mode 100644
index 00000000000..40648319ca2
--- /dev/null
+++ b/test/fixtures/bridge/pages/assets.vue
@@ -0,0 +1,20 @@
+<template>
+  <div>
+    <img src="~/assets/logo.svg" class="h-20 mb-4">
+    <img src="/public.svg" class="h-20 mb-4">
+    <img :src="logo" class="h-20 mb-4">
+  </div>
+</template>
+
+<script setup>
+import logo from '~/assets/logo.svg'
+</script>
+
+<style>
+#__nuxt {
+  background-image: url('~/assets/logo.svg');
+}
+body {
+  background-image: url('/public.svg');
+}
+</style>
diff --git a/test/fixtures/bridge/static/public.svg b/test/fixtures/bridge/static/public.svg
new file mode 100644
index 00000000000..c31de56afcf
--- /dev/null
+++ b/test/fixtures/bridge/static/public.svg
@@ -0,0 +1,18 @@
+<svg viewBox="0 0 221 65" fill="none" xmlns="http://www.w3.org/2000/svg" class="h-8">
+  <g clip-path="url(#a)">
+    <path fill="currentColor"
+      d="M82.5623 18.5705h7.3017l15.474 24.7415V18.5705h6.741v35.0576h-7.252L89.3025 28.938v24.6901h-6.7402V18.5705ZM142.207 53.628h-6.282v-3.916c-1.429 2.7559-4.339 4.3076-8.015 4.3076-5.822 0-9.603-4.1069-9.603-10.0175V28.3847h6.282v14.3251c0 3.4558 2.146 5.8592 5.362 5.8592 3.524 0 5.974-2.7044 5.974-6.4099V28.3847h6.282V53.628ZM164.064 53.2289l-6.026-8.4144-6.027 8.4144h-6.69l9.296-13.1723-8.58-12.0709h6.843l5.158 7.2641 5.106-7.2641h6.895l-8.632 12.0709 9.295 13.1723h-6.638ZM183.469 20.7726v7.6116h7.149v5.1593h-7.149v12.5311c0 .4208.17.8245.473 1.1223.303.2978.715.4654 1.144.4661h5.532v5.9547h-4.137c-5.617 0-9.293-3.2062-9.293-8.8109V33.5484h-5.056v-5.1642h3.172c1.479 0 2.34-.8639 2.34-2.2932v-5.3184h5.825Z">
+    </path>
+    <path fill-rule="evenodd" clip-rule="evenodd"
+      d="M30.1185 11.5456c-1.8853-3.24168-6.5987-3.24169-8.484 0L1.08737 46.8747c-1.885324 3.2417.47133 7.2938 4.24199 7.2938H21.3695c-1.6112-1.4081-2.2079-3.8441-.9886-5.9341l15.5615-26.675-5.8239-10.0138Z"
+      fill="#80EEC0"></path>
+    <path
+      d="M43.1374 19.2952c1.5603-2.6523 5.461-2.6523 7.0212 0l17.0045 28.9057c1.5603 2.6522-.39 5.9676-3.5106 5.9676h-34.009c-3.1206 0-5.0709-3.3154-3.5106-5.9676l17.0045-28.9057ZM209.174 53.8005H198.483c0-1.8514.067-3.4526 0-6.0213h10.641c1.868 0 3.353.1001 4.354-.934 1-1.0341 1.501-2.3351 1.501-3.9029 0-1.8347-.667-3.2191-2.002-4.1532-1.301-.9674-2.985-1.4511-5.054-1.4511h-2.601v-5.2539h2.652c1.701 0 3.119-.4003 4.253-1.2009 1.134-.8006 1.701-1.9849 1.701-3.5527 0-1.301-.434-2.3351-1.301-3.1023-.834-.8007-2.001-1.201-3.503-1.201-1.634 0-2.918.4837-3.853 1.4511-.9.9674-1.401 2.1517-1.501 3.5527h-6.254c.133-3.2358 1.251-5.7877 3.352-7.6558 2.135-1.868 4.887-2.8021 8.256-2.8021 2.402 0 4.42.4337 6.055 1.301 1.668.834 2.919 1.9515 3.753 3.3525.867 1.4011 1.301 2.9523 1.301 4.6536 0 1.9681-.551 3.636-1.651 5.0037-1.068 1.3344-2.402 2.235-4.004 2.7021 1.969.4003 3.57 1.3677 4.804 2.9022 1.234 1.5011 1.852 3.4025 1.852 5.7043 0 1.9347-.468 3.7028-1.402 5.304-.934 1.6012-2.301 2.8855-4.103 3.8529-1.768.9674-3.953 1.4511-6.555 1.4511Z"
+      fill="#00DC82"></path>
+  </g>
+  <defs>
+    <clipPath id="a">
+      <path fill="#fff" d="M0 0h221v65H0z"></path>
+    </clipPath>
+  </defs>
+</svg>
diff --git a/yarn.lock b/yarn.lock
index a08aef5e7f9..df20e03b61a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -47,7 +47,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/core@npm:^7.14.0, @babel/core@npm:^7.16.0, @babel/core@npm:^7.16.10, @babel/core@npm:^7.17.2, @babel/core@npm:^7.17.5, @babel/core@npm:^7.17.7, @babel/core@npm:^7.17.8":
+"@babel/core@npm:^7.14.0, @babel/core@npm:^7.16.0, @babel/core@npm:^7.16.10, @babel/core@npm:^7.17.5, @babel/core@npm:^7.17.7, @babel/core@npm:^7.17.8":
   version: 7.17.8
   resolution: "@babel/core@npm:7.17.8"
   dependencies:
@@ -1306,7 +1306,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/standalone@npm:^7.17.2, @babel/standalone@npm:^7.17.7":
+"@babel/standalone@npm:^7.17.7, @babel/standalone@npm:^7.17.8":
   version: 7.17.8
   resolution: "@babel/standalone@npm:7.17.8"
   checksum: ca72ff478ab72ae79601e2070a65df30b38de874772f66469cee860981d55f4ef45a57fff2afcaac588e644733696596ed7e0fa0907836f7d0f53a22b9fcd622
@@ -1549,9 +1549,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@iconify/utils@npm:^1.0.23":
-  version: 1.0.31
-  resolution: "@iconify/utils@npm:1.0.31"
+"@iconify/utils@npm:^1.0.31":
+  version: 1.0.32
+  resolution: "@iconify/utils@npm:1.0.32"
   dependencies:
     "@antfu/install-pkg": ^0.1.0
     "@antfu/utils": ^0.5.0
@@ -1559,7 +1559,7 @@ __metadata:
     debug: ^4.3.4
     kolorist: ^1.5.1
     local-pkg: ^0.4.1
-  checksum: 46cd9ee75ebeb613af338edb872c79200e28822380c5bb69416736b05b504dd4f89b6920ed4042db0194a644190d2bb25603016049ff89494e340e2e50faf7c3
+  checksum: 914a24beb8dc8adc7064c937979a7ebfa9e577f3024cc92f29934a0dc07430edee44b589acb137a4c234aa8f3a96178c97adf3ca827cf72f6621be042d9eb620
   languageName: node
   linkType: hard
 
@@ -2377,13 +2377,13 @@ __metadata:
   linkType: hard
 
 "@mapbox/node-pre-gyp@npm:^1.0.5":
-  version: 1.0.8
-  resolution: "@mapbox/node-pre-gyp@npm:1.0.8"
+  version: 1.0.9
+  resolution: "@mapbox/node-pre-gyp@npm:1.0.9"
   dependencies:
-    detect-libc: ^1.0.3
+    detect-libc: ^2.0.0
     https-proxy-agent: ^5.0.0
     make-dir: ^3.1.0
-    node-fetch: ^2.6.5
+    node-fetch: ^2.6.7
     nopt: ^5.0.0
     npmlog: ^5.0.1
     rimraf: ^3.0.2
@@ -2391,7 +2391,7 @@ __metadata:
     tar: ^6.1.11
   bin:
     node-pre-gyp: bin/node-pre-gyp
-  checksum: 29a38f39575107fa1665edf14defcfdf62e12bb38e9c27f7457ba42be84060125015171d12b8de3065155a465992f1854a363e2985f071fcbea9ff0701362b05
+  checksum: 1b9c4c87a68d200daa13151d0fe033aa7aa8f7b26f3585255424dd8dfee2ec672c3e9bea4071c624469bc0aebbbcde08f8a300c8a958db52c50abadd5fb56920
   languageName: node
   linkType: hard
 
@@ -2599,7 +2599,7 @@ __metadata:
     "@types/fs-extra": ^9.0.13
     "@types/hash-sum": ^1.0.0
     "@types/node-fetch": ^3.0.2
-    "@vitejs/plugin-legacy": ^1.7.1
+    "@vitejs/plugin-legacy": ^1.8.0
     "@vue/composition-api": ^1.4.9
     "@vueuse/head": ^0.7.5
     acorn: ^8.7.0
@@ -2631,13 +2631,13 @@ __metadata:
     postcss-url: ^10.1.3
     scule: ^0.2.1
     semver: ^7.3.5
-    ufo: ^0.8.1
+    ufo: ^0.8.3
     unbuild: latest
     unimport: ^0.1.3
-    unplugin: ^0.6.0
-    unplugin-vue2-script-setup: ^0.10.0
-    untyped: ^0.4.3
-    vite: ^2.8.6
+    unplugin: ^0.6.1
+    unplugin-vue2-script-setup: ^0.10.2
+    untyped: ^0.4.4
+    vite: ^2.9.1
     vite-plugin-vue2: ^1.9.3
     vue: ^2
     vue-router: ^3
@@ -2931,17 +2931,17 @@ __metadata:
     scule: ^0.2.1
     semver: ^7.3.5
     unbuild: latest
-    unctx: ^1.1.2
+    unctx: ^1.1.4
     unimport: ^0.1.3
-    untyped: ^0.4.3
+    untyped: ^0.4.4
   languageName: unknown
   linkType: soft
 
 "@nuxt/kit@npm:@nuxt/kit-edge@latest":
-  version: 3.0.0-27470218.7c1a8ae
-  resolution: "@nuxt/kit-edge@npm:3.0.0-27470218.7c1a8ae"
+  version: 3.0.0-27480376.fdd38f9
+  resolution: "@nuxt/kit-edge@npm:3.0.0-27480376.fdd38f9"
   dependencies:
-    "@nuxt/schema": "npm:@nuxt/schema-edge@3.0.0-27470218.7c1a8ae"
+    "@nuxt/schema": "npm:@nuxt/schema-edge@3.0.0-27480376.fdd38f9"
     c12: ^0.2.4
     consola: ^2.15.3
     defu: ^6.0.0
@@ -2951,15 +2951,15 @@ __metadata:
     jiti: ^1.13.0
     knitwork: ^0.1.1
     lodash.template: ^4.5.0
-    mlly: ^0.4.3
+    mlly: ^0.5.1
     pathe: ^0.2.0
     pkg-types: ^0.3.2
     scule: ^0.2.1
     semver: ^7.3.5
-    unctx: ^1.1.2
+    unctx: ^1.1.4
     unimport: ^0.1.3
-    untyped: ^0.4.3
-  checksum: 4a26c57a946a3ff04c465488cc15fe222ed06a8befa891ccd42c9c8b6c1491058e9aa6b70ced24a9d5e59b90b694dd07d7e7a7bd08dc1371d740968b6b4b4621
+    untyped: ^0.4.4
+  checksum: 3db9a4ee6dc787bcccdce2a78f36120c8bee30e6a46938491ef95a45cb2cacdae4a48637c4826898b5f2c5c5050b61e12e27161a95c9d36c5cb80e03c8904d36
   languageName: node
   linkType: hard
 
@@ -2987,7 +2987,7 @@ __metadata:
     "@nuxt/schema": 3.0.0
     "@nuxt/ui-templates": "npm:@nuxt/ui-templates-edge@latest"
     "@rollup/plugin-alias": ^3.1.9
-    "@rollup/plugin-commonjs": ^21.0.2
+    "@rollup/plugin-commonjs": ^21.0.3
     "@rollup/plugin-inject": ^4.0.4
     "@rollup/plugin-json": ^4.1.0
     "@rollup/plugin-node-resolve": ^13.1.3
@@ -3012,7 +3012,7 @@ __metadata:
     defu: ^6.0.0
     destr: ^1.1.0
     dot-prop: ^7.2.0
-    esbuild: ^0.14.27
+    esbuild: ^0.14.31
     etag: ^1.8.1
     fs-extra: ^10.0.1
     globby: ^13.1.1
@@ -3041,7 +3041,7 @@ __metadata:
     serve-static: ^1.15.0
     std-env: ^3.0.1
     table: ^6.8.0
-    ufo: ^0.8.1
+    ufo: ^0.8.3
     unbuild: latest
     unenv: ^0.4.3
     unstorage: ^0.3.3
@@ -3094,15 +3094,15 @@ __metadata:
     postcss-import-resolver: ^2.0.0
     scule: ^0.2.1
     std-env: ^3.0.1
-    ufo: ^0.8.1
+    ufo: ^0.8.3
     unbuild: latest
     unimport: ^0.1.3
   languageName: unknown
   linkType: soft
 
-"@nuxt/schema@npm:@nuxt/schema-edge@3.0.0-27470218.7c1a8ae":
-  version: 3.0.0-27470218.7c1a8ae
-  resolution: "@nuxt/schema-edge@npm:3.0.0-27470218.7c1a8ae"
+"@nuxt/schema@npm:@nuxt/schema-edge@3.0.0-27480376.fdd38f9":
+  version: 3.0.0-27480376.fdd38f9
+  resolution: "@nuxt/schema-edge@npm:3.0.0-27480376.fdd38f9"
   dependencies:
     c12: ^0.2.4
     create-require: ^1.1.1
@@ -3112,9 +3112,9 @@ __metadata:
     postcss-import-resolver: ^2.0.0
     scule: ^0.2.1
     std-env: ^3.0.1
-    ufo: ^0.8.1
+    ufo: ^0.8.3
     unimport: ^0.1.3
-  checksum: e5d010f9ce05593a49e812b818025d5777518bd4339ceb3f1f0b9dd3a7961c4c9c43a99adecd4a84899791ee095e0a7a57127a2013c8858fd8bcb7b1accbe1e1
+  checksum: 7a929e4fb733b800ea50696d4c67d6fff6081bae27227d3c2f11774c5aed109f41d029cdc3c6df18d321b2324ef602bf02d27ebe8b6b91deef45e63de3cd72c5
   languageName: node
   linkType: hard
 
@@ -3207,9 +3207,9 @@ __metadata:
     get-port-please: ^2.4.3
     jiti: ^1.13.0
     ohmyfetch: ^0.4.15
-    playwright: ^1.20.1
+    playwright: ^1.20.2
     unbuild: latest
-    vitest: ^0.7.11
+    vitest: ^0.8.4
   peerDependencies:
     vue: 3.2.31
   languageName: unknown
@@ -3243,30 +3243,32 @@ __metadata:
   linkType: hard
 
 "@nuxt/ui-templates@npm:@nuxt/ui-templates-edge@latest":
-  version: 0.0.0-27455683.83d2457
-  resolution: "@nuxt/ui-templates-edge@npm:0.0.0-27455683.83d2457"
-  checksum: d36d9e1d74ce7c91c7affa5ffcdb5881c0ad8ff8fb4b579b10d09e44a9235c2cd1fc47b7a6d5201d8105168adbf8e700b6de46cadd4effa62d33e0408818dfdb
+  version: 0.0.0-27479051.598a8a0
+  resolution: "@nuxt/ui-templates-edge@npm:0.0.0-27479051.598a8a0"
+  checksum: e2642887eb337fedf9a45839a2403119c23709d5273a91f96ee1cd63fe13b93188096e84b839f172ca0e0692f12eae0f1536711cae9f1d2d3ef2f458569e7485
   languageName: node
   linkType: hard
 
 "@nuxt/ui@npm:@nuxt/ui-edge@latest":
-  version: 0.0.0-27455683.83d2457
-  resolution: "@nuxt/ui-edge@npm:0.0.0-27455683.83d2457"
+  version: 0.0.0-27479051.598a8a0
+  resolution: "@nuxt/ui-edge@npm:0.0.0-27479051.598a8a0"
   dependencies:
     "@iconify-json/carbon": ^1.1.2
     "@nuxt/kit": "npm:@nuxt/kit-edge@latest"
-    "@unocss/core": ^0.28.1
-    "@unocss/nuxt": ^0.28.1
-    "@unocss/preset-attributify": ^0.28.1
-    "@unocss/preset-icons": ^0.28.1
-    "@unocss/preset-mini": ^0.28.1
-    "@unocss/reset": ^0.28.1
-    "@vueuse/core": ^8.0.1
-    "@vueuse/integrations": ^8.0.1
-    "@vueuse/nuxt": ^8.0.1
+    "@nuxtjs/color-mode": ^3.0.2
+    "@unocss/core": ^0.30.8
+    "@unocss/nuxt": ^0.30.8
+    "@unocss/preset-attributify": ^0.30.8
+    "@unocss/preset-icons": ^0.30.8
+    "@unocss/preset-mini": ^0.30.8
+    "@unocss/reset": ^0.30.8
+    "@vueuse/core": ^8.2.3
+    "@vueuse/integrations": ^8.2.3
+    "@vueuse/nuxt": ^8.2.3
+    defu: ^6.0.0
     focus-trap: ^6.7.3
-    unocss: ^0.28.1
-  checksum: 6d71e664d409f71b1513296ff3c7a57e41566d21203111501d6e3c527bfba2df6504be2a2ea6aba75113019f6f99ebbacce2909f043feaf1550e2b4ed267c6e8
+    unocss: ^0.30.8
+  checksum: 4f5e14bcd5348b090aa68c199efe3da611841206b4caa8d4d3ab08daf9c9b4ca0cae28867d21c5a6246d6da95f120371a6f1736fd16367c4dbf11a605cdffefa
   languageName: node
   linkType: hard
 
@@ -3317,13 +3319,13 @@ __metadata:
     "@nuxt/kit": 3.0.0
     "@nuxt/schema": 3.0.0
     "@types/cssnano": ^5
-    "@vitejs/plugin-vue": ^2.2.4
-    "@vitejs/plugin-vue-jsx": ^1.3.8
+    "@vitejs/plugin-vue": ^2.3.1
+    "@vitejs/plugin-vue-jsx": ^1.3.9
     autoprefixer: ^10.4.4
     chokidar: ^3.5.3
-    cssnano: ^5.1.5
+    cssnano: ^5.1.7
     defu: ^6.0.0
-    esbuild: ^0.14.27
+    esbuild: ^0.14.31
     escape-string-regexp: ^5.0.0
     externality: ^0.2.1
     fs-extra: ^10.0.1
@@ -3338,11 +3340,11 @@ __metadata:
     postcss-url: ^10.1.3
     rollup: ^2.70.1
     rollup-plugin-visualizer: ^5.6.0
-    ufo: ^0.8.1
+    ufo: ^0.8.3
     unbuild: latest
-    unplugin: ^0.6.0
-    vite: ^2.8.6
-    vite-node: ^0.7.11
+    unplugin: ^0.6.1
+    vite: ^2.9.1
+    vite-node: ^0.8.4
     vue: 3.2.31
   peerDependencies:
     vue: 3.2.31
@@ -3439,7 +3441,7 @@ __metadata:
     autoprefixer: ^10.4.4
     css-loader: ^6.7.1
     css-minimizer-webpack-plugin: ^3.4.1
-    cssnano: ^5.1.5
+    cssnano: ^5.1.7
     esbuild-loader: ^2.18.0
     escape-string-regexp: ^5.0.0
     file-loader: ^6.2.0
@@ -3458,14 +3460,14 @@ __metadata:
     postcss-url: ^10.1.3
     style-resources-loader: ^1.5.0
     time-fix-plugin: ^2.0.7
-    ufo: ^0.8.1
+    ufo: ^0.8.3
     unbuild: latest
-    unplugin: ^0.6.0
+    unplugin: ^0.6.1
     url-loader: ^4.1.1
     vue: 3.2.31
     vue-loader: ^17.0.0
     vue-style-loader: ^4.1.3
-    webpack: ^5.70.0
+    webpack: ^5.71.0
     webpack-bundle-analyzer: ^4.5.0
     webpack-dev-middleware: ^5.3.1
     webpack-hot-middleware: ^2.25.1
@@ -3583,6 +3585,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@nuxtjs/color-mode@npm:^3.0.2":
+  version: 3.0.2
+  resolution: "@nuxtjs/color-mode@npm:3.0.2"
+  dependencies:
+    "@nuxt/kit": "npm:@nuxt/kit-edge@latest"
+    defu: ^5.0.0
+    lodash.template: ^4.5.0
+    pathe: ^0.2.0
+  checksum: 54e3706a45dc78cfc0ab29aa77f5ae59f624eca2c8181400aa717289d517f7588960f5d8dec00f703c47afff153c3bb59776246aba647fe8caf6bd07b709b929
+  languageName: node
+  linkType: hard
+
 "@nuxtjs/eslint-config-typescript@npm:^9.0.0":
   version: 9.0.0
   resolution: "@nuxtjs/eslint-config-typescript@npm:9.0.0"
@@ -3815,9 +3829,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@rollup/plugin-commonjs@npm:^21.0.2":
-  version: 21.0.2
-  resolution: "@rollup/plugin-commonjs@npm:21.0.2"
+"@rollup/plugin-commonjs@npm:^21.0.2, @rollup/plugin-commonjs@npm:^21.0.3":
+  version: 21.0.3
+  resolution: "@rollup/plugin-commonjs@npm:21.0.3"
   dependencies:
     "@rollup/pluginutils": ^3.1.0
     commondir: ^1.0.1
@@ -3828,7 +3842,7 @@ __metadata:
     resolve: ^1.17.0
   peerDependencies:
     rollup: ^2.38.3
-  checksum: 5fd4c7b75d7881070f4395d7ba5f9035934f53b25e92d136583cc794461a456efc1e2a2204f946ec567dfea58073c38cb48f24d27155b89af0df0447c2cd0758
+  checksum: 23307d3b7eb8d64dd966fbe380b85bf3b5f4908c7344427d45918d570cf6b48710ef6f155bea74545127c10de9d64f87dd2219078e83dbccf927505d38774de8
   languageName: node
   linkType: hard
 
@@ -4253,9 +4267,9 @@ __metadata:
   linkType: hard
 
 "@types/json-schema@npm:*, @types/json-schema@npm:^7.0.5, @types/json-schema@npm:^7.0.8, @types/json-schema@npm:^7.0.9":
-  version: 7.0.10
-  resolution: "@types/json-schema@npm:7.0.10"
-  checksum: 369f12207298e3c8931100ab86c9c60d9217ab930a8ae0b851495f4f30695d3f0eb431eedc8e8d9c69357869899ea0fe6f9d65ddde5ea70415d67ef340dfdd1f
+  version: 7.0.11
+  resolution: "@types/json-schema@npm:7.0.11"
+  checksum: 527bddfe62db9012fccd7627794bd4c71beb77601861055d87e3ee464f2217c85fca7a4b56ae677478367bbd248dbde13553312b7d4dbc702a2f2bbf60c4018d
   languageName: node
   linkType: hard
 
@@ -4283,9 +4297,9 @@ __metadata:
   linkType: hard
 
 "@types/lodash@npm:*":
-  version: 4.14.180
-  resolution: "@types/lodash@npm:4.14.180"
-  checksum: fc42ae3473695cac6e91553f832fef8eb51a31c1c0381cafa81b00dc3efe18e279786bdda77caf0b90a8340ba2ba7aa46ae6541d69870565f775d04c89128bc1
+  version: 4.14.181
+  resolution: "@types/lodash@npm:4.14.181"
+  checksum: 0d1863d8383fd2f8bb42e9e3fc1d6255bb88ff034d6df848941063698944313dae944fc1270315613e3d303fae7c7a9a86085ad3235ed6204c56c4b0b3699aa9
   languageName: node
   linkType: hard
 
@@ -4682,12 +4696,12 @@ __metadata:
   linkType: hard
 
 "@typescript-eslint/eslint-plugin@npm:^5.14.0":
-  version: 5.16.0
-  resolution: "@typescript-eslint/eslint-plugin@npm:5.16.0"
+  version: 5.17.0
+  resolution: "@typescript-eslint/eslint-plugin@npm:5.17.0"
   dependencies:
-    "@typescript-eslint/scope-manager": 5.16.0
-    "@typescript-eslint/type-utils": 5.16.0
-    "@typescript-eslint/utils": 5.16.0
+    "@typescript-eslint/scope-manager": 5.17.0
+    "@typescript-eslint/type-utils": 5.17.0
+    "@typescript-eslint/utils": 5.17.0
     debug: ^4.3.2
     functional-red-black-tree: ^1.0.1
     ignore: ^5.1.8
@@ -4700,42 +4714,42 @@ __metadata:
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 4007cc1599503424037300e7401fb969ca441b122ef8a8f2fc8d70f84d656fdf7ab7b0d00e506a3aaf702871616c3756da17eb1508ff315dfb25170f2d28a904
+  checksum: 62ec611fb384f27fc5b101fc8a0642ae94b2975618d37d3157c2f887cf89b389624e9d476bff303073d038076c05e6c00f3b205af3b2302967e720e99cd18d38
   languageName: node
   linkType: hard
 
 "@typescript-eslint/parser@npm:^5.14.0":
-  version: 5.16.0
-  resolution: "@typescript-eslint/parser@npm:5.16.0"
+  version: 5.17.0
+  resolution: "@typescript-eslint/parser@npm:5.17.0"
   dependencies:
-    "@typescript-eslint/scope-manager": 5.16.0
-    "@typescript-eslint/types": 5.16.0
-    "@typescript-eslint/typescript-estree": 5.16.0
+    "@typescript-eslint/scope-manager": 5.17.0
+    "@typescript-eslint/types": 5.17.0
+    "@typescript-eslint/typescript-estree": 5.17.0
     debug: ^4.3.2
   peerDependencies:
     eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 40006578e9ac451c80dc4b4b7e29af97b53fb9e9ea660d6ca17fb98b5c9858c648f9b17523c9de9b9b9e4155af17b65435e6163f02c4a2dfacf48274f45cba21
+  checksum: 15b855ea84e44371366d44b5add87ed0dc34b856ca8a6949ecc4066faaf3ea3d7e016ea92db06ab97a637530148c472c38c19cc5eff68b691701ff89dc5c1abc
   languageName: node
   linkType: hard
 
-"@typescript-eslint/scope-manager@npm:5.16.0":
-  version: 5.16.0
-  resolution: "@typescript-eslint/scope-manager@npm:5.16.0"
+"@typescript-eslint/scope-manager@npm:5.17.0":
+  version: 5.17.0
+  resolution: "@typescript-eslint/scope-manager@npm:5.17.0"
   dependencies:
-    "@typescript-eslint/types": 5.16.0
-    "@typescript-eslint/visitor-keys": 5.16.0
-  checksum: 008a6607d3e6ebcc59a9b28cddcc25703f39a88e27a96c69a6d988acc50a1ea7dbf50963c165ffa5b85a101209a0da3a7ec6832633a162ca4ecc78c0e54acd9f
+    "@typescript-eslint/types": 5.17.0
+    "@typescript-eslint/visitor-keys": 5.17.0
+  checksum: 8fc28d5742f36994ce05f09b0000f696a600d6f757f39ccae7875c08398b266f21d48ed1dfb027549d9c6692255a1fb3e8482ef94d765bb134371824da7d5ba7
   languageName: node
   linkType: hard
 
-"@typescript-eslint/type-utils@npm:5.16.0":
-  version: 5.16.0
-  resolution: "@typescript-eslint/type-utils@npm:5.16.0"
+"@typescript-eslint/type-utils@npm:5.17.0":
+  version: 5.17.0
+  resolution: "@typescript-eslint/type-utils@npm:5.17.0"
   dependencies:
-    "@typescript-eslint/utils": 5.16.0
+    "@typescript-eslint/utils": 5.17.0
     debug: ^4.3.2
     tsutils: ^3.21.0
   peerDependencies:
@@ -4743,23 +4757,23 @@ __metadata:
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 86d9f1dff6a096c8465453b8c7d0cc667b87a769f19073bfa9bbd36f8baa772c0384ec396b1132052383846bbbcf0d051345ed7d373260c1b506ed27100b383d
+  checksum: 9aad46ea7a757ec4584b9d9c995e94543bf40af7d85b2f502d66db08d7f03468c858320fccb4942238b0bb9e2d432df3d9861cf21624b0c57660c88b1d91a7d4
   languageName: node
   linkType: hard
 
-"@typescript-eslint/types@npm:5.16.0":
-  version: 5.16.0
-  resolution: "@typescript-eslint/types@npm:5.16.0"
-  checksum: 0450125741c3eef9581da0b75b4a987a633d77009cfb03507c3db29885b790ee80e3c0efc4f9a0dd3376ba758b49c7829722676153472616a57bb04bce5cc4fa
+"@typescript-eslint/types@npm:5.17.0":
+  version: 5.17.0
+  resolution: "@typescript-eslint/types@npm:5.17.0"
+  checksum: 06ed4c3c3f0a05bee9c23b6cb5eb679336c0f4769beb28848e8ce674f726fec88adba059f20e0b0f7271685d7f5480931b3bcafcf6b60044b93da162e29f3f68
   languageName: node
   linkType: hard
 
-"@typescript-eslint/typescript-estree@npm:5.16.0":
-  version: 5.16.0
-  resolution: "@typescript-eslint/typescript-estree@npm:5.16.0"
+"@typescript-eslint/typescript-estree@npm:5.17.0":
+  version: 5.17.0
+  resolution: "@typescript-eslint/typescript-estree@npm:5.17.0"
   dependencies:
-    "@typescript-eslint/types": 5.16.0
-    "@typescript-eslint/visitor-keys": 5.16.0
+    "@typescript-eslint/types": 5.17.0
+    "@typescript-eslint/visitor-keys": 5.17.0
     debug: ^4.3.2
     globby: ^11.0.4
     is-glob: ^4.0.3
@@ -4768,43 +4782,43 @@ __metadata:
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 930ead4655712c3bd40885fb6b2074cd3c10fb03da864dd7a7dd2e43abfd330bb07e505f0aec8b4846178bff8befbb017f9f3370c67e9c717e4cb8d3df6e16ef
+  checksum: 589829b1bb1d7e704de6a35dd9a39c70a3ca54b0885b68aad54a864bc5e5a11ce43f917c3f15f0afe9bc734a250288efdf03dfbed70b8fe0cc12f759e2e1f8ef
   languageName: node
   linkType: hard
 
-"@typescript-eslint/utils@npm:5.16.0, @typescript-eslint/utils@npm:^5.10.0":
-  version: 5.16.0
-  resolution: "@typescript-eslint/utils@npm:5.16.0"
+"@typescript-eslint/utils@npm:5.17.0, @typescript-eslint/utils@npm:^5.10.0":
+  version: 5.17.0
+  resolution: "@typescript-eslint/utils@npm:5.17.0"
   dependencies:
     "@types/json-schema": ^7.0.9
-    "@typescript-eslint/scope-manager": 5.16.0
-    "@typescript-eslint/types": 5.16.0
-    "@typescript-eslint/typescript-estree": 5.16.0
+    "@typescript-eslint/scope-manager": 5.17.0
+    "@typescript-eslint/types": 5.17.0
+    "@typescript-eslint/typescript-estree": 5.17.0
     eslint-scope: ^5.1.1
     eslint-utils: ^3.0.0
   peerDependencies:
     eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
-  checksum: 46749091a204d7cf80d81b04704e23a86903a142a7e35cc5068a821c147c3bf098a7eff99af2b0e2ea7310013ca90300db9bab33ae5e3b5f773ed1d2961a5ed4
+  checksum: 88de02eafb7d39950c520c53aa07ffe63c95ca7ef2262c39d2afd3c6aabcd5d717ba61f74314f5bc9c27588b721ff016b45af6fc1de88801c6ac4bf5ebaf8775
   languageName: node
   linkType: hard
 
-"@typescript-eslint/visitor-keys@npm:5.16.0":
-  version: 5.16.0
-  resolution: "@typescript-eslint/visitor-keys@npm:5.16.0"
+"@typescript-eslint/visitor-keys@npm:5.17.0":
+  version: 5.17.0
+  resolution: "@typescript-eslint/visitor-keys@npm:5.17.0"
   dependencies:
-    "@typescript-eslint/types": 5.16.0
+    "@typescript-eslint/types": 5.17.0
     eslint-visitor-keys: ^3.0.0
-  checksum: b587bf3b0da95bb58ff877b75fefcee6472222de1e3ec76aa4b94cae66078b62a372c7d0343374a16aab15cdcbae3f9e019624028b35827f68ef6559389f7fd0
+  checksum: 333468277b50e2fc381ba1b99ccb410046c422e0329c791c51bea62e705edd16ba97f75b668c6945a3ea3dc43b89a1739693ea60bfa241c67ce42e8b474e5048
   languageName: node
   linkType: hard
 
-"@unocss/cli@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/cli@npm:0.28.3"
+"@unocss/cli@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/cli@npm:0.30.8"
   dependencies:
-    "@unocss/config": 0.28.3
-    "@unocss/core": 0.28.3
-    "@unocss/preset-uno": 0.28.3
+    "@unocss/config": 0.30.8
+    "@unocss/core": 0.30.8
+    "@unocss/preset-uno": 0.30.8
     cac: ^6.7.12
     chokidar: ^3.5.3
     colorette: ^2.0.16
@@ -4813,192 +4827,191 @@ __metadata:
     pathe: ^0.2.0
   bin:
     unocss: bin/unocss.cjs
-  checksum: 4926a030f708400ee8bc4244e6747bf5d28ac21ad64410061febb695bc41b3de0c391c13d1bbd7652e2f17948f0d4b0ed707d367f182feff0a807d690507e1a4
+  checksum: e3488af8561081c9ba221b43f81d88f99b96593be16832160fede7f1144ded6539e7cc89806856cc6dfa8274914526bcac39eba9a98d28e5659babc98456841c
   languageName: node
   linkType: hard
 
-"@unocss/config@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/config@npm:0.28.3"
+"@unocss/config@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/config@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
-    unconfig: ^0.3.1
-  checksum: 0d23c8af6d66596013feec3d1a4b7275642f8a41a4f16daa95c286ff27dd4e22f18134f6574ac34723c3aca5898ab0d790901c05089f790e4cd5b8e61eed8d2c
+    "@unocss/core": 0.30.8
+    unconfig: ^0.3.2
+  checksum: 150e08a07c474c89bc969ff2c06a512e55c41c57c57d6120d6321888820f254e6608ef549eaaf5ae283fb3e4466c89082a76cebdca183037f704212a596d7b2a
   languageName: node
   linkType: hard
 
-"@unocss/core@npm:0.28.3, @unocss/core@npm:^0.28.1":
-  version: 0.28.3
-  resolution: "@unocss/core@npm:0.28.3"
-  checksum: 5007da5b466f75d8f8c9a4c756827b53258dfadb92ab9deb51984ccc23279bcfe6df740ccd98b97083b436b1b19d43bfe1ccd3584263d96ee11630aec3776ba4
+"@unocss/core@npm:0.30.8, @unocss/core@npm:^0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/core@npm:0.30.8"
+  checksum: 49e6373465841facb6ac8395c8e1ad0001def2abedb68ebb7870317489c0d7326702f80f6d48eb3088fe1351f27ffcee4ee630001a9ba7399d59d966d20ffc94
   languageName: node
   linkType: hard
 
-"@unocss/inspector@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/inspector@npm:0.28.3"
+"@unocss/inspector@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/inspector@npm:0.30.8"
   dependencies:
     gzip-size: ^6.0.0
     sirv: ^2.0.2
-  checksum: dc1bba87739e95cc9d65a6cf436ab090ce0c75defb738278df806ef3ec811eac4affea457979773f9998670a3d849a5a5872caa4d7730a03659052677052dc42
+  checksum: 399492c5c9c46853d681e9ad8aac388236c4eecc423bfe847e76662ba3aceed6b5fa130c86432fa32f60053a68d09d711c72319df12e2a811dabf3048b272f50
   languageName: node
   linkType: hard
 
-"@unocss/nuxt@npm:^0.28.1":
-  version: 0.28.3
-  resolution: "@unocss/nuxt@npm:0.28.3"
+"@unocss/nuxt@npm:^0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/nuxt@npm:0.30.8"
   dependencies:
     "@nuxt/kit": "npm:@nuxt/kit-edge@latest"
-    "@unocss/core": 0.28.3
-    "@unocss/preset-attributify": 0.28.3
-    "@unocss/preset-icons": 0.28.3
-    "@unocss/preset-typography": 0.28.3
-    "@unocss/preset-uno": 0.28.3
-    "@unocss/preset-web-fonts": 0.28.3
-    "@unocss/reset": 0.28.3
-    "@unocss/vite": 0.28.3
-    "@unocss/webpack": 0.28.3
-    unocss: 0.28.3
-  checksum: 8d70aedfdc30544db90a6cfccf90d49142e5c70771c54c56e20655582875064fbadafc030834e006b708ab6c5284dac753ff87a9708faa7dc80219c68bb921a4
+    "@unocss/core": 0.30.8
+    "@unocss/preset-attributify": 0.30.8
+    "@unocss/preset-icons": 0.30.8
+    "@unocss/preset-typography": 0.30.8
+    "@unocss/preset-uno": 0.30.8
+    "@unocss/preset-web-fonts": 0.30.8
+    "@unocss/reset": 0.30.8
+    "@unocss/vite": 0.30.8
+    "@unocss/webpack": 0.30.8
+    unocss: 0.30.8
+  checksum: 31125400a7e7b419d289297bc8b48356b58364ccaf6428337b915b7fe2ed21de511bef4c5437b20ea138d5eb537e6810290ab1cc66e3091d2e8032b69d09e193
   languageName: node
   linkType: hard
 
-"@unocss/preset-attributify@npm:0.28.3, @unocss/preset-attributify@npm:^0.28.1":
-  version: 0.28.3
-  resolution: "@unocss/preset-attributify@npm:0.28.3"
+"@unocss/preset-attributify@npm:0.30.8, @unocss/preset-attributify@npm:^0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/preset-attributify@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
-  checksum: feeb1313c25ed320ad1c9dac5f03b1c8c5fb00cf2c920c958b9da45d8408499217b1bbe9d7d3293bc9d6dafb27e77225a03416007e04509665c239ef4348382f
+    "@unocss/core": 0.30.8
+  checksum: d24c3f6c16be796185c820e8efd35fee9c0b303e7cb028a43ac98ffee1b48b5a31d6a5477356594700e76faa28a361d1cb35ca74ccfd86b8c3c41d8db0c8b038
   languageName: node
   linkType: hard
 
-"@unocss/preset-icons@npm:0.28.3, @unocss/preset-icons@npm:^0.28.1":
-  version: 0.28.3
-  resolution: "@unocss/preset-icons@npm:0.28.3"
+"@unocss/preset-icons@npm:0.30.8, @unocss/preset-icons@npm:^0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/preset-icons@npm:0.30.8"
   dependencies:
-    "@iconify/utils": ^1.0.23
-    "@unocss/core": 0.28.3
-    local-pkg: ^0.4.1
-  checksum: 6b06c881af9d19ae563f20450ccee714cad80af9090c46d72d3f3f8e688984a5de024ff8ad386ba29fd4418c2c54c0e1094b3afe847e3342aa229d6cb514d657
+    "@iconify/utils": ^1.0.31
+    "@unocss/core": 0.30.8
+  checksum: 3026e46d824b19b60fe0b1b4954bef2d5101f3f97611a13f6058cd765ea66381f76578691bc059210f1169f42b753985440f8636b2cb75af63f558ffbd0789b2
   languageName: node
   linkType: hard
 
-"@unocss/preset-mini@npm:0.28.3, @unocss/preset-mini@npm:^0.28.1":
-  version: 0.28.3
-  resolution: "@unocss/preset-mini@npm:0.28.3"
+"@unocss/preset-mini@npm:0.30.8, @unocss/preset-mini@npm:^0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/preset-mini@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
-  checksum: 54b86b6ca57de43de252b5aae69bee1021949aecce55674baa15d5b2947302a247c1ae898bb82ca855bdca5e3003e7fc8ec5e96aca5ac5033180702a1f4fef98
+    "@unocss/core": 0.30.8
+  checksum: f8cfcc1417d6d12e9a3a2e337d43a30db8dd7eaac6f6da97722f0196abf3bb969942ef8ae7da2ad7f1f64f405d01d09ba9df72064fef3fdbddb763ff23c38e8e
   languageName: node
   linkType: hard
 
-"@unocss/preset-typography@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/preset-typography@npm:0.28.3"
+"@unocss/preset-typography@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/preset-typography@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
-  checksum: ea9ddc94f5197f4ece10dfd7323d7e451305abc44fe374ff7ecaf8aa12f4cd7cf862be5c9768aa0a1374cac1aa9ab9a7a4ccd42aa66691512330a68281cbb29e
+    "@unocss/core": 0.30.8
+  checksum: eb6b0a0c187db4ccf9ffee9ae114686066cbbd8204f493ee7ed5e8ab28113417e2c803182322b18bedd2e4c9a3f16588d590394bfc14f605222b84eee4a3e83e
   languageName: node
   linkType: hard
 
-"@unocss/preset-uno@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/preset-uno@npm:0.28.3"
+"@unocss/preset-uno@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/preset-uno@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
-    "@unocss/preset-mini": 0.28.3
-    "@unocss/preset-wind": 0.28.3
-  checksum: 71eb561308bcc53931c454f11fb2f8a3efa199dd501c3b5b7e471e64fd5c6e6520be03a88de23ffacaa588fd7bb4c1cf09835ac775e5663afd814bf4ce1c90e5
+    "@unocss/core": 0.30.8
+    "@unocss/preset-mini": 0.30.8
+    "@unocss/preset-wind": 0.30.8
+  checksum: 92d6389371c41a5a6c13c5b5b357b47231fb8e5e274539a6553b63c28dab97eeca4e420073aeb05fc59a90d5655d434224dbab5609ef9511e1211a19103ccf5a
   languageName: node
   linkType: hard
 
-"@unocss/preset-web-fonts@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/preset-web-fonts@npm:0.28.3"
+"@unocss/preset-web-fonts@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/preset-web-fonts@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
+    "@unocss/core": 0.30.8
     axios: ^0.26.1
-  checksum: e1e5569cd86d8b25e5b0b5604cf46681da41ffa37ad68ecff6a07078cdc94257f6819919bab46d2e67fac5a2d613c8d8d763780e1be4ed6f96c829f4599e4171
+  checksum: df2cdda022193a6828632e7d658a7a54ccd38697060a4f896dd6d9cd6506b6aedd3879c88bcb46928a3c3d6c8b446f16f34368bac20fa45775b3c857e3eb532f
   languageName: node
   linkType: hard
 
-"@unocss/preset-wind@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/preset-wind@npm:0.28.3"
+"@unocss/preset-wind@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/preset-wind@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
-    "@unocss/preset-mini": 0.28.3
-  checksum: 75011600ea671875cd2ff1e2ae1d7a09176b420d118e5a30f28652655958a532aae41e4d0a0d3d8d1c8d0f5d2de1fb206cee54c0bbb4c7181e45c00df163f053
+    "@unocss/core": 0.30.8
+    "@unocss/preset-mini": 0.30.8
+  checksum: 4c5c9111395cde7b6307c3228918850fc3f5bcd61be63a8de0757524d03d74f144aec1155a94662b0b2d7991718e145a193c9b8d3c0dc0ccafde1ffd17163944
   languageName: node
   linkType: hard
 
-"@unocss/reset@npm:0.28.3, @unocss/reset@npm:^0.28.1":
-  version: 0.28.3
-  resolution: "@unocss/reset@npm:0.28.3"
-  checksum: c433504a50571456bbf1ac62d5c585955560a60fa243820ec230f1d5cade79b7d38d18c70f9d4b3a3c8439d7dcfd43895c5ee59368072cf1c16961a113ba7612
+"@unocss/reset@npm:0.30.8, @unocss/reset@npm:^0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/reset@npm:0.30.8"
+  checksum: cb6a1d65adb09edf2697eda19aae9bece10a557d946abe249a6f96659bccb2a313504382088c214be0c57fcaaa15f9983f3d696527c23fc78018a17dff28514e
   languageName: node
   linkType: hard
 
-"@unocss/reset@npm:^0.30.3":
-  version: 0.30.3
-  resolution: "@unocss/reset@npm:0.30.3"
-  checksum: 01d153f937938ff46d707f5b6f5b797505fe61b3277196a91ffcb275a312157a6651aee6b54bba9de729a75690b2cdc72adf8eb9e9ace39a3128a87e22141dda
+"@unocss/reset@npm:^0.30.11":
+  version: 0.30.11
+  resolution: "@unocss/reset@npm:0.30.11"
+  checksum: 022cc6b49193485506beeb96833729aa37cc3310700a33d3507e41217d2646cbbe2d78c55559a46168ef35cbec8ebf61c99735406d3d11357f027eae509e9ec6
   languageName: node
   linkType: hard
 
-"@unocss/scope@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/scope@npm:0.28.3"
-  checksum: 31d1008fb6d23de6ca3bfd519f1672e7c3748ff378c9afc6b020609793d4608f2964d9eb50991e6b6a8f03958675ffaa3ed77dd6c9c1833f7d093a0e5a00330d
+"@unocss/scope@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/scope@npm:0.30.8"
+  checksum: ca56844bcc7d706a9a54c35efb40b5c8937f5450ced17d7c3d581ec59161540d009473084ed96de90bc6a28438e0bf9bf2d9bf56a8c41d02ec14fea7c8ed525d
   languageName: node
   linkType: hard
 
-"@unocss/transformer-directives@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/transformer-directives@npm:0.28.3"
+"@unocss/transformer-directives@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/transformer-directives@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
+    "@unocss/core": 0.30.8
     css-tree: ^2.1.0
-  checksum: ba3cc9e6bfa1fb90c06230e2b5e2df995fb792d521448ea33440e503edf099242cef9750e667c190e3244703bbfda5a62d19f060da86120618476d70c9dece84
+  checksum: 4f381f490ddae9d3c4aa74c696283e042a48211aaf92c9e55b837a0bfc8459bfaa63c9729df09c00460fe4134e33b04eea3b3363651774aaf0183931e130043a
   languageName: node
   linkType: hard
 
-"@unocss/transformer-variant-group@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/transformer-variant-group@npm:0.28.3"
+"@unocss/transformer-variant-group@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/transformer-variant-group@npm:0.30.8"
   dependencies:
-    "@unocss/core": 0.28.3
-  checksum: 74a559999a9062445b3f54b32238c172ad662c9b73efea580db376ce76774eac0e3af3df741f56dfac8e8c66e0364ea8a981388a66282d6e5513037ec7cc57d6
+    "@unocss/core": 0.30.8
+  checksum: 1ae768d8f4e7658bfc0567f4d11dda2cd1a071769b605f7a8e933628ef471b10ceca3b8f9dd8aeaa7cb8b0e299b8a06825f8fee69e7fbcde88630243e723cc56
   languageName: node
   linkType: hard
 
-"@unocss/vite@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/vite@npm:0.28.3"
+"@unocss/vite@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/vite@npm:0.30.8"
   dependencies:
     "@rollup/pluginutils": ^4.2.0
-    "@unocss/config": 0.28.3
-    "@unocss/core": 0.28.3
-    "@unocss/inspector": 0.28.3
-    "@unocss/scope": 0.28.3
-    "@unocss/transformer-directives": 0.28.3
+    "@unocss/config": 0.30.8
+    "@unocss/core": 0.30.8
+    "@unocss/inspector": 0.30.8
+    "@unocss/scope": 0.30.8
+    "@unocss/transformer-directives": 0.30.8
     magic-string: ^0.26.1
-  checksum: 4d7503b7ae81df24e2abe5f72ac3757974a7ff984c6666a4841d700aea98e8e9c88863df1c1c564fd0dfeca85db59a71ca4db66120e5ad8060b3e3d96daf75c8
+  checksum: 7dd6df1e7caee47bf9688153c4be40cc9d0545bcee62d9e4ffc8618cafc314ce9adcac3cdbb968c29bde50dbeab02326774fb97146ca617e0a283facf70dae87
   languageName: node
   linkType: hard
 
-"@unocss/webpack@npm:0.28.3":
-  version: 0.28.3
-  resolution: "@unocss/webpack@npm:0.28.3"
+"@unocss/webpack@npm:0.30.8":
+  version: 0.30.8
+  resolution: "@unocss/webpack@npm:0.30.8"
   dependencies:
     "@rollup/pluginutils": ^4.2.0
-    "@unocss/config": 0.28.3
-    "@unocss/core": 0.28.3
-    unplugin: ^0.4.0
+    "@unocss/config": 0.30.8
+    "@unocss/core": 0.30.8
+    unplugin: ^0.6.0
     webpack-sources: ^3.2.3
   peerDependencies:
     webpack: ^4 || ^5
-  checksum: f58f21eb1d6ae0a9a7d7bacb9a892341ff4274a818d52c2f8706d403ee0a16a862dd73db03b98a4af918e88164541a486f595d4cf5f15589df3b67a1bfe4561f
+  checksum: 5264a7e9a4caa50f606fdf870546974ba3babe962cf8369071b4a40525b09d53c67fae3a76d5b343124d34590324f433b81ae70f6a2b5486414c58649d2d25af
   languageName: node
   linkType: hard
 
@@ -5044,42 +5057,42 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vitejs/plugin-legacy@npm:^1.7.1":
-  version: 1.7.1
-  resolution: "@vitejs/plugin-legacy@npm:1.7.1"
+"@vitejs/plugin-legacy@npm:^1.8.0":
+  version: 1.8.0
+  resolution: "@vitejs/plugin-legacy@npm:1.8.0"
   dependencies:
-    "@babel/standalone": ^7.17.2
-    core-js: ^3.21.0
-    magic-string: ^0.25.7
+    "@babel/standalone": ^7.17.8
+    core-js: ^3.21.1
+    magic-string: ^0.26.1
     regenerator-runtime: ^0.13.9
     systemjs: ^6.12.1
   peerDependencies:
     vite: ^2.8.0
-  checksum: 99332e2138c008343c219706b1e15ae646172c522c9612b8b925cb8d264c7debae1e48ef79a978244d9a7d0558c4bf7442ccc9c1bafe6d857817d37b89a856ec
+  checksum: 8a129c0885e1f112b877c18fee1ab4b088668c402b1617894490dbd35a78567659d4fce7e0bc534b6d9133c7d7c0f7dc6811b723e3d67ec0e3f8380de35e859a
   languageName: node
   linkType: hard
 
-"@vitejs/plugin-vue-jsx@npm:^1.3.8":
-  version: 1.3.8
-  resolution: "@vitejs/plugin-vue-jsx@npm:1.3.8"
+"@vitejs/plugin-vue-jsx@npm:^1.3.9":
+  version: 1.3.9
+  resolution: "@vitejs/plugin-vue-jsx@npm:1.3.9"
   dependencies:
-    "@babel/core": ^7.17.2
+    "@babel/core": ^7.17.8
     "@babel/plugin-syntax-import-meta": ^7.10.4
     "@babel/plugin-transform-typescript": ^7.16.8
-    "@rollup/pluginutils": ^4.1.2
+    "@rollup/pluginutils": ^4.2.0
     "@vue/babel-plugin-jsx": ^1.1.1
     hash-sum: ^2.0.0
-  checksum: c2e0684b06a63281ce2c53548cb927f02bcea0df1bfe9d542a757e5561a1ac08f5ab75aaeaa3fd43fee205c149417b26e36c840d41abcc8ed97c493842c0c9eb
+  checksum: e4ec9869c1929eb8a6cc0659eeb1453d192f45792c3a280ad9dfafd059fb8c17d7da526c13a8e3c63866da1b991ef7b9daf724b2004cbbcfab76d75cfd550b67
   languageName: node
   linkType: hard
 
-"@vitejs/plugin-vue@npm:^2.2.4":
-  version: 2.2.4
-  resolution: "@vitejs/plugin-vue@npm:2.2.4"
+"@vitejs/plugin-vue@npm:^2.3.1":
+  version: 2.3.1
+  resolution: "@vitejs/plugin-vue@npm:2.3.1"
   peerDependencies:
     vite: ^2.5.10
     vue: ^3.2.25
-  checksum: 915f494940dd62d20204671a0d3bd81bcd44c02b314847325c9d0ad2f634eb3c012d3a00ffcac60416a5239e1d5e47e9cbf38f9c8cc9de708e12b98876ce946b
+  checksum: 7102d80c7b37c5761213ca57a5d50db95bda387dee92a77bd3d0198fd00c47d117ba82761c26a9d40f83e274d6fa8e3932765f5f930e8139848be7b7b176a200
   languageName: node
   linkType: hard
 
@@ -5381,9 +5394,9 @@ __metadata:
   linkType: hard
 
 "@vue/devtools-api@npm:^6.0.0":
-  version: 6.1.3
-  resolution: "@vue/devtools-api@npm:6.1.3"
-  checksum: 1ed9171ef889eb94ab69715ecb5c03c3d5df4639c02aac9ae35f880e186de2fdc7dfe1d1efd945878131871815fc88aeeaf64dac58ec31e09a96ec5f5e484bf9
+  version: 6.1.4
+  resolution: "@vue/devtools-api@npm:6.1.4"
+  checksum: 027bb138b03ec7147dd15e5d0ef28d5b72c822530396cc8a86bc6fdb049dc6850314b9e897e497064e3ed47fad229a18141f56b8b8ca3d41092a576dc5b6538d
   languageName: node
   linkType: hard
 
@@ -5449,12 +5462,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vueuse/core@npm:8.1.2, @vueuse/core@npm:^8.0.1":
-  version: 8.1.2
-  resolution: "@vueuse/core@npm:8.1.2"
+"@vueuse/core@npm:8.2.3, @vueuse/core@npm:^8.2.3":
+  version: 8.2.3
+  resolution: "@vueuse/core@npm:8.2.3"
   dependencies:
-    "@vueuse/metadata": 8.1.2
-    "@vueuse/shared": 8.1.2
+    "@vueuse/metadata": 8.2.3
+    "@vueuse/shared": 8.2.3
     vue-demi: "*"
   peerDependencies:
     "@vue/composition-api": ^1.1.0
@@ -5464,7 +5477,7 @@ __metadata:
       optional: true
     vue:
       optional: true
-  checksum: 3fe0ea7883ac7cf513ab5149de234ca779097d8c920aa95973ae4d2b46613b7ca88c4e75fffa13d9e91a6c9943ad88965527ecd2974085a5e4afc361c088278b
+  checksum: 6740f54727d2c8f1795d225940ce844df41237d002ff3b4c2a235432b19854d329bfae80e836b546a86330e8258c4cfd58031130477321e0de14da1cf6fccc79
   languageName: node
   linkType: hard
 
@@ -5477,12 +5490,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vueuse/integrations@npm:^8.0.1":
-  version: 8.1.2
-  resolution: "@vueuse/integrations@npm:8.1.2"
+"@vueuse/integrations@npm:^8.2.3":
+  version: 8.2.3
+  resolution: "@vueuse/integrations@npm:8.2.3"
   dependencies:
-    "@vueuse/core": 8.1.2
-    "@vueuse/shared": 8.1.2
+    "@vueuse/core": 8.2.3
+    "@vueuse/shared": 8.2.3
     vue-demi: "*"
   peerDependencies:
     axios: "*"
@@ -5511,33 +5524,33 @@ __metadata:
       optional: true
     universal-cookie:
       optional: true
-  checksum: 33905b7e9fd402dd25ab9ae3862c5ef5794170c6c53225e90ae8e151e22a0aed6e30936628d0b02277eb134718d71c090e2aae71c1d5c181fbcd6d67e67223ce
+  checksum: ce358b2def4c9be558e06cc2fa63bdf263a138d2fceb31f684fd95d6131ace473b6070b82814b69be11bed72a37edb7747047d837d84b23bdd99edb42b9143e8
   languageName: node
   linkType: hard
 
-"@vueuse/metadata@npm:8.1.2":
-  version: 8.1.2
-  resolution: "@vueuse/metadata@npm:8.1.2"
-  checksum: 84c42f893bf16504b33ec33e8b58cc1f2bb982d03889c6259d5ad51054aeab6136e3913e5954152a67c45579fbd1556c681efef9121c886d09ec4c6a64c80878
+"@vueuse/metadata@npm:8.2.3":
+  version: 8.2.3
+  resolution: "@vueuse/metadata@npm:8.2.3"
+  checksum: d3e386ef071f98f0faaf2a01ea203e66c485a5d102096d155e02096b91ee548a9b2aa15dea8361c37190730e1124860a45342a83d4dca8e6e0acbeb68fa803ed
   languageName: node
   linkType: hard
 
-"@vueuse/nuxt@npm:^8.0.1":
-  version: 8.1.2
-  resolution: "@vueuse/nuxt@npm:8.1.2"
+"@vueuse/nuxt@npm:^8.2.3":
+  version: 8.2.3
+  resolution: "@vueuse/nuxt@npm:8.2.3"
   dependencies:
     "@nuxt/kit": "npm:@nuxt/kit-edge@latest"
-    "@vueuse/core": 8.1.2
-    "@vueuse/metadata": 8.1.2
+    "@vueuse/core": 8.2.3
+    "@vueuse/metadata": 8.2.3
     local-pkg: ^0.4.1
     vue-demi: "*"
-  checksum: 0c3503aefea76e1cc16dac5b9a3ee551e04378e436fdf790522eabb76ede3b3ba59f2b2c3aa7a4b7280bfb1c3c58b8a39bfddec6fb73aed24416c48737c3d30e
+  checksum: 28b12d5c5b1b125cf9d63ccb0f62c8bc2b10f62bea51df2925b8a184d0268ad0805dc202db456da28be5c88923df6a0cbb46451e3aa7483df1fffcc256c67401
   languageName: node
   linkType: hard
 
-"@vueuse/shared@npm:8.1.2":
-  version: 8.1.2
-  resolution: "@vueuse/shared@npm:8.1.2"
+"@vueuse/shared@npm:8.2.3":
+  version: 8.2.3
+  resolution: "@vueuse/shared@npm:8.2.3"
   dependencies:
     vue-demi: "*"
   peerDependencies:
@@ -5548,7 +5561,7 @@ __metadata:
       optional: true
     vue:
       optional: true
-  checksum: 45ecac2c4aada45aec2568411e95a39cb5797395bb3d8315c113863c7ffde563e467bd23a6ee3b8e834980217609354b992231c98dc148528bc352cfe98e7eb7
+  checksum: b20bfb89c993b25caec59beebc1a5b11a4641f369ca53aa76bb897b25ff80a47b0ee82c5531c716fa59ec8c17ae8acb7a6d4906cbbf2b16a1abea7d7d4990fb7
   languageName: node
   linkType: hard
 
@@ -7272,9 +7285,9 @@ __metadata:
   linkType: hard
 
 "caniuse-lite@npm:^1.0.0, caniuse-lite@npm:^1.0.30000981, caniuse-lite@npm:^1.0.30001109, caniuse-lite@npm:^1.0.30001228, caniuse-lite@npm:^1.0.30001275, caniuse-lite@npm:^1.0.30001317":
-  version: 1.0.30001320
-  resolution: "caniuse-lite@npm:1.0.30001320"
-  checksum: d1f52e9d8e2316f2dba4c7adb4c5957e535b07a4a90ac5432bef3a83b4dab487f0efaa6eff3cda75a52bf044d09886ec583299595389fe0a92cf135f4f07692e
+  version: 1.0.30001323
+  resolution: "caniuse-lite@npm:1.0.30001323"
+  checksum: 053cffe1f33ef7c97ce5a1111f17ec4872ce50f152cb0b787fddc748afa98e442a885acbfdf6c39c59b5af4e9d338e288ce2901eea150e64389d2d3b86248790
   languageName: node
   linkType: hard
 
@@ -8143,7 +8156,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"core-js@npm:^3.19.0, core-js@npm:^3.21.0":
+"core-js@npm:^3.19.0, core-js@npm:^3.21.1":
   version: 3.21.1
   resolution: "core-js@npm:3.21.1"
   checksum: d68eddd831340ad5b24ac29c72fda022a43b17f194c4278b6b875a843283d316502cb4abd07f28631d6ebc4387f66aa06e2b1b3c8fd7e08096a751b5c63f6889
@@ -8344,14 +8357,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"css-declaration-sorter@npm:^6.0.3":
-  version: 6.1.4
-  resolution: "css-declaration-sorter@npm:6.1.4"
-  dependencies:
-    timsort: ^0.3.0
+"css-declaration-sorter@npm:^6.2.2":
+  version: 6.2.2
+  resolution: "css-declaration-sorter@npm:6.2.2"
   peerDependencies:
     postcss: ^8.0.9
-  checksum: 72800a234f0d4facf44a5b504170749b854cd3bd6bf16d0955b3e70a1b613cec0192f585a81e8db1f03c035b13ca9494698a7eaaf861150db51c2f8f643e8ffb
+  checksum: afd3aea1b763b7abb5a9d0e10e973e99520b528522be421d9ef13d4fa7ead2cd48acd85d48c0fd0e954f596da2181dafbafc176a080ab017ebd1909a8231c9b4
   languageName: node
   linkType: hard
 
@@ -8507,15 +8518,15 @@ __metadata:
   linkType: hard
 
 "css-select@npm:^4.1.3, css-select@npm:^4.2.1":
-  version: 4.2.1
-  resolution: "css-select@npm:4.2.1"
+  version: 4.3.0
+  resolution: "css-select@npm:4.3.0"
   dependencies:
     boolbase: ^1.0.0
-    css-what: ^5.1.0
-    domhandler: ^4.3.0
+    css-what: ^6.0.1
+    domhandler: ^4.3.1
     domutils: ^2.8.0
     nth-check: ^2.0.1
-  checksum: 6617193ec7c332217204c4ea371d332c6845603fda415e36032e7e9e18206d7c368a14e3c57532082314d2689955b01122aa1097c1c52b6c1cab7ad90970d3c6
+  checksum: d6202736839194dd7f910320032e7cfc40372f025e4bf21ca5bf6eb0a33264f322f50ba9c0adc35dadd342d3d6fae5ca244779a4873afbfa76561e343f2058e0
   languageName: node
   linkType: hard
 
@@ -8556,10 +8567,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"css-what@npm:^5.1.0":
-  version: 5.1.0
-  resolution: "css-what@npm:5.1.0"
-  checksum: 0b75d1bac95c885c168573c85744a6c6843d8c33345f54f717218b37ea6296b0e99bb12105930ea170fd4a921990392a7c790c16c585c1d8960c49e2b7ec39f7
+"css-what@npm:^6.0.1":
+  version: 6.1.0
+  resolution: "css-what@npm:6.1.0"
+  checksum: b975e547e1e90b79625918f84e67db5d33d896e6de846c9b584094e529f0c63e2ab85ee33b9daffd05bff3a146a1916bec664e18bb76dd5f66cbff9fc13b2bbe
   languageName: node
   linkType: hard
 
@@ -8633,11 +8644,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"cssnano-preset-default@npm:^5.2.5":
-  version: 5.2.5
-  resolution: "cssnano-preset-default@npm:5.2.5"
+"cssnano-preset-default@npm:^5.2.6":
+  version: 5.2.6
+  resolution: "cssnano-preset-default@npm:5.2.6"
   dependencies:
-    css-declaration-sorter: ^6.0.3
+    css-declaration-sorter: ^6.2.2
     cssnano-utils: ^3.1.0
     postcss-calc: ^8.2.3
     postcss-colormin: ^5.3.0
@@ -8668,7 +8679,46 @@ __metadata:
     postcss-unique-selectors: ^5.1.1
   peerDependencies:
     postcss: ^8.2.15
-  checksum: cb743cf2c2a29edb019caeee7a3c9853fadafe54ebe66fb899665fb50d9fe2c79f918180cf39c218dda0195cf704e15bd3a8a5c2d639b2388cddf512d0795f6c
+  checksum: e15cc624cf46540ca8d22769153a232182400ea9bbbce9309447f3eae5eeca2241d61d525629158729f16bcd5a593ff1e4c00de3587fdd9fd97ccdaf00fdd984
+  languageName: node
+  linkType: hard
+
+"cssnano-preset-default@npm:^5.2.7":
+  version: 5.2.7
+  resolution: "cssnano-preset-default@npm:5.2.7"
+  dependencies:
+    css-declaration-sorter: ^6.2.2
+    cssnano-utils: ^3.1.0
+    postcss-calc: ^8.2.3
+    postcss-colormin: ^5.3.0
+    postcss-convert-values: ^5.1.0
+    postcss-discard-comments: ^5.1.1
+    postcss-discard-duplicates: ^5.1.0
+    postcss-discard-empty: ^5.1.1
+    postcss-discard-overridden: ^5.1.0
+    postcss-merge-longhand: ^5.1.4
+    postcss-merge-rules: ^5.1.1
+    postcss-minify-font-values: ^5.1.0
+    postcss-minify-gradients: ^5.1.1
+    postcss-minify-params: ^5.1.2
+    postcss-minify-selectors: ^5.2.0
+    postcss-normalize-charset: ^5.1.0
+    postcss-normalize-display-values: ^5.1.0
+    postcss-normalize-positions: ^5.1.0
+    postcss-normalize-repeat-style: ^5.1.0
+    postcss-normalize-string: ^5.1.0
+    postcss-normalize-timing-functions: ^5.1.0
+    postcss-normalize-unicode: ^5.1.0
+    postcss-normalize-url: ^5.1.0
+    postcss-normalize-whitespace: ^5.1.1
+    postcss-ordered-values: ^5.1.1
+    postcss-reduce-initial: ^5.1.0
+    postcss-reduce-transforms: ^5.1.0
+    postcss-svgo: ^5.1.0
+    postcss-unique-selectors: ^5.1.1
+  peerDependencies:
+    postcss: ^8.2.15
+  checksum: 1408ce86e29756a90dafcfff162ccfd983ab31fcfdb1549875bb4cca657b0c520424ea95f88b750ea06967d5a61201de207afe0a4c5514fac90d7265358b9d3a
   languageName: node
   linkType: hard
 
@@ -8723,16 +8773,29 @@ __metadata:
   languageName: node
   linkType: hard
 
-"cssnano@npm:^5.0.6, cssnano@npm:^5.1.5":
-  version: 5.1.5
-  resolution: "cssnano@npm:5.1.5"
+"cssnano@npm:^5.0.6":
+  version: 5.1.6
+  resolution: "cssnano@npm:5.1.6"
+  dependencies:
+    cssnano-preset-default: ^5.2.6
+    lilconfig: ^2.0.3
+    yaml: ^1.10.2
+  peerDependencies:
+    postcss: ^8.2.15
+  checksum: 9eb334220a8054cecb95b2c2e44e91186a69d7619f38c4b911ab74b7a6aa89e56105ae464bf7a8164a78b0422602d756d76b4a6a15d9075bdb117c6949e817a7
+  languageName: node
+  linkType: hard
+
+"cssnano@npm:^5.1.7":
+  version: 5.1.7
+  resolution: "cssnano@npm:5.1.7"
   dependencies:
-    cssnano-preset-default: ^5.2.5
+    cssnano-preset-default: ^5.2.7
     lilconfig: ^2.0.3
     yaml: ^1.10.2
   peerDependencies:
     postcss: ^8.2.15
-  checksum: 7fec29799355f1ccefa370b249bb3b3fb498fb4c6ccd7c7a39e9c6af0632bfffd71b7c93baa19da67d04dcf56de71365b9f8bec9198daa29e8e5847a9f3ec881
+  checksum: d69e7e0091b7e6e43f3d61e416a54afb7a55a2a065d96d859650fa34ab5e70b3162a340fb59a8714042762f8e388fbc3cb810d478d775bcd4695d0951b625000
   languageName: node
   linkType: hard
 
@@ -9088,7 +9151,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"detect-libc@npm:^1.0.2, detect-libc@npm:^1.0.3":
+"detect-libc@npm:^1.0.2":
   version: 1.0.3
   resolution: "detect-libc@npm:1.0.3"
   bin:
@@ -9097,6 +9160,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"detect-libc@npm:^2.0.0":
+  version: 2.0.1
+  resolution: "detect-libc@npm:2.0.1"
+  checksum: ccb05fcabbb555beb544d48080179c18523a343face9ee4e1a86605a8715b4169f94d663c21a03c310ac824592f2ba9a5270218819bb411ad7be578a527593d7
+  languageName: node
+  linkType: hard
+
 "devalue@npm:^2.0.1":
   version: 2.0.1
   resolution: "devalue@npm:2.0.1"
@@ -9212,7 +9282,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"domhandler@npm:^4.0.0, domhandler@npm:^4.2.0, domhandler@npm:^4.3.0":
+"domhandler@npm:^4.0.0, domhandler@npm:^4.2.0, domhandler@npm:^4.3.1":
   version: 4.3.1
   resolution: "domhandler@npm:4.3.1"
   dependencies:
@@ -9344,9 +9414,9 @@ __metadata:
   linkType: hard
 
 "electron-to-chromium@npm:^1.4.84":
-  version: 1.4.93
-  resolution: "electron-to-chromium@npm:1.4.93"
-  checksum: 997411da3a4dba3e7f38f5eff98f099a44d76088293982e452e886af8c5717ddbd6c9677e0e0840e51610004decb170c6a529424ba067c84eb45e303d6640224
+  version: 1.4.103
+  resolution: "electron-to-chromium@npm:1.4.103"
+  checksum: ae5783cafb1f49e92946416fafc5af45d85e5a6847ce00f4cf4b4d2e54bca1d27b26699ea2cedf5b700c1a0190329e7ec20dc06198daa9f0c343044bc074ae75
   languageName: node
   linkType: hard
 
@@ -9501,8 +9571,8 @@ __metadata:
   linkType: hard
 
 "es-abstract@npm:^1.17.2, es-abstract@npm:^1.18.5, es-abstract@npm:^1.19.0, es-abstract@npm:^1.19.1":
-  version: 1.19.1
-  resolution: "es-abstract@npm:1.19.1"
+  version: 1.19.2
+  resolution: "es-abstract@npm:1.19.2"
   dependencies:
     call-bind: ^1.0.2
     es-to-primitive: ^1.2.1
@@ -9510,21 +9580,21 @@ __metadata:
     get-intrinsic: ^1.1.1
     get-symbol-description: ^1.0.0
     has: ^1.0.3
-    has-symbols: ^1.0.2
+    has-symbols: ^1.0.3
     internal-slot: ^1.0.3
     is-callable: ^1.2.4
-    is-negative-zero: ^2.0.1
+    is-negative-zero: ^2.0.2
     is-regex: ^1.1.4
     is-shared-array-buffer: ^1.0.1
     is-string: ^1.0.7
-    is-weakref: ^1.0.1
-    object-inspect: ^1.11.0
+    is-weakref: ^1.0.2
+    object-inspect: ^1.12.0
     object-keys: ^1.1.1
     object.assign: ^4.1.2
     string.prototype.trimend: ^1.0.4
     string.prototype.trimstart: ^1.0.4
     unbox-primitive: ^1.0.1
-  checksum: b6be8410672c5364db3fb01eb786e30c7b4bb32b4af63d381c08840f4382c4a168e7855cd338bf59d4f1a1a1138f4d748d1fd40ec65aaa071876f9e9fbfed949
+  checksum: 4724811fd54b2cea959a8b08e49cd41cc65c77363c37bf5b42dc64a7c730e16a0dca80edc73e46ebf90a8de311622009a5a8dbe47e9f4e129c35f52c5020fe4e
   languageName: node
   linkType: hard
 
@@ -9546,9 +9616,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-android-64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-android-64@npm:0.14.27"
+"esbuild-android-64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-android-64@npm:0.14.29"
+  conditions: os=android & cpu=x64
+  languageName: node
+  linkType: hard
+
+"esbuild-android-64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-android-64@npm:0.14.31"
   conditions: os=android & cpu=x64
   languageName: node
   linkType: hard
@@ -9560,9 +9637,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-android-arm64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-android-arm64@npm:0.14.27"
+"esbuild-android-arm64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-android-arm64@npm:0.14.29"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"esbuild-android-arm64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-android-arm64@npm:0.14.31"
   conditions: os=android & cpu=arm64
   languageName: node
   linkType: hard
@@ -9574,9 +9658,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-darwin-64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-darwin-64@npm:0.14.27"
+"esbuild-darwin-64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-darwin-64@npm:0.14.29"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
+"esbuild-darwin-64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-darwin-64@npm:0.14.31"
   conditions: os=darwin & cpu=x64
   languageName: node
   linkType: hard
@@ -9588,9 +9679,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-darwin-arm64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-darwin-arm64@npm:0.14.27"
+"esbuild-darwin-arm64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-darwin-arm64@npm:0.14.29"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"esbuild-darwin-arm64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-darwin-arm64@npm:0.14.31"
   conditions: os=darwin & cpu=arm64
   languageName: node
   linkType: hard
@@ -9602,9 +9700,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-freebsd-64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-freebsd-64@npm:0.14.27"
+"esbuild-freebsd-64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-freebsd-64@npm:0.14.29"
+  conditions: os=freebsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"esbuild-freebsd-64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-freebsd-64@npm:0.14.31"
   conditions: os=freebsd & cpu=x64
   languageName: node
   linkType: hard
@@ -9616,9 +9721,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-freebsd-arm64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-freebsd-arm64@npm:0.14.27"
+"esbuild-freebsd-arm64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-freebsd-arm64@npm:0.14.29"
+  conditions: os=freebsd & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"esbuild-freebsd-arm64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-freebsd-arm64@npm:0.14.31"
   conditions: os=freebsd & cpu=arm64
   languageName: node
   linkType: hard
@@ -9630,9 +9742,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-linux-32@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-linux-32@npm:0.14.27"
+"esbuild-linux-32@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-linux-32@npm:0.14.29"
+  conditions: os=linux & cpu=ia32
+  languageName: node
+  linkType: hard
+
+"esbuild-linux-32@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-linux-32@npm:0.14.31"
   conditions: os=linux & cpu=ia32
   languageName: node
   linkType: hard
@@ -9644,9 +9763,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-linux-64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-linux-64@npm:0.14.27"
+"esbuild-linux-64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-linux-64@npm:0.14.29"
+  conditions: os=linux & cpu=x64
+  languageName: node
+  linkType: hard
+
+"esbuild-linux-64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-linux-64@npm:0.14.31"
   conditions: os=linux & cpu=x64
   languageName: node
   linkType: hard
@@ -9658,9 +9784,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-linux-arm64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-linux-arm64@npm:0.14.27"
+"esbuild-linux-arm64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-linux-arm64@npm:0.14.29"
+  conditions: os=linux & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"esbuild-linux-arm64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-linux-arm64@npm:0.14.31"
   conditions: os=linux & cpu=arm64
   languageName: node
   linkType: hard
@@ -9672,9 +9805,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-linux-arm@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-linux-arm@npm:0.14.27"
+"esbuild-linux-arm@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-linux-arm@npm:0.14.29"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
+"esbuild-linux-arm@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-linux-arm@npm:0.14.31"
   conditions: os=linux & cpu=arm
   languageName: node
   linkType: hard
@@ -9686,9 +9826,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-linux-mips64le@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-linux-mips64le@npm:0.14.27"
+"esbuild-linux-mips64le@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-linux-mips64le@npm:0.14.29"
+  conditions: os=linux & cpu=mips64el
+  languageName: node
+  linkType: hard
+
+"esbuild-linux-mips64le@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-linux-mips64le@npm:0.14.31"
   conditions: os=linux & cpu=mips64el
   languageName: node
   linkType: hard
@@ -9700,23 +9847,44 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-linux-ppc64le@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-linux-ppc64le@npm:0.14.27"
+"esbuild-linux-ppc64le@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-linux-ppc64le@npm:0.14.29"
+  conditions: os=linux & cpu=ppc64
+  languageName: node
+  linkType: hard
+
+"esbuild-linux-ppc64le@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-linux-ppc64le@npm:0.14.31"
   conditions: os=linux & cpu=ppc64
   languageName: node
   linkType: hard
 
-"esbuild-linux-riscv64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-linux-riscv64@npm:0.14.27"
+"esbuild-linux-riscv64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-linux-riscv64@npm:0.14.29"
+  conditions: os=linux & cpu=riscv64
+  languageName: node
+  linkType: hard
+
+"esbuild-linux-riscv64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-linux-riscv64@npm:0.14.31"
   conditions: os=linux & cpu=riscv64
   languageName: node
   linkType: hard
 
-"esbuild-linux-s390x@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-linux-s390x@npm:0.14.27"
+"esbuild-linux-s390x@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-linux-s390x@npm:0.14.29"
+  conditions: os=linux & cpu=s390x
+  languageName: node
+  linkType: hard
+
+"esbuild-linux-s390x@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-linux-s390x@npm:0.14.31"
   conditions: os=linux & cpu=s390x
   languageName: node
   linkType: hard
@@ -9744,9 +9912,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-netbsd-64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-netbsd-64@npm:0.14.27"
+"esbuild-netbsd-64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-netbsd-64@npm:0.14.29"
+  conditions: os=netbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"esbuild-netbsd-64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-netbsd-64@npm:0.14.31"
   conditions: os=netbsd & cpu=x64
   languageName: node
   linkType: hard
@@ -9758,9 +9933,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-openbsd-64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-openbsd-64@npm:0.14.27"
+"esbuild-openbsd-64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-openbsd-64@npm:0.14.29"
+  conditions: os=openbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"esbuild-openbsd-64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-openbsd-64@npm:0.14.31"
   conditions: os=openbsd & cpu=x64
   languageName: node
   linkType: hard
@@ -9772,9 +9954,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-sunos-64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-sunos-64@npm:0.14.27"
+"esbuild-sunos-64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-sunos-64@npm:0.14.29"
+  conditions: os=sunos & cpu=x64
+  languageName: node
+  linkType: hard
+
+"esbuild-sunos-64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-sunos-64@npm:0.14.31"
   conditions: os=sunos & cpu=x64
   languageName: node
   linkType: hard
@@ -9786,9 +9975,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-windows-32@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-windows-32@npm:0.14.27"
+"esbuild-windows-32@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-windows-32@npm:0.14.29"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
+"esbuild-windows-32@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-windows-32@npm:0.14.31"
   conditions: os=win32 & cpu=ia32
   languageName: node
   linkType: hard
@@ -9800,9 +9996,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-windows-64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-windows-64@npm:0.14.27"
+"esbuild-windows-64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-windows-64@npm:0.14.29"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
+"esbuild-windows-64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-windows-64@npm:0.14.31"
   conditions: os=win32 & cpu=x64
   languageName: node
   linkType: hard
@@ -9814,9 +10017,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild-windows-arm64@npm:0.14.27":
-  version: 0.14.27
-  resolution: "esbuild-windows-arm64@npm:0.14.27"
+"esbuild-windows-arm64@npm:0.14.29":
+  version: 0.14.29
+  resolution: "esbuild-windows-arm64@npm:0.14.29"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"esbuild-windows-arm64@npm:0.14.31":
+  version: 0.14.31
+  resolution: "esbuild-windows-arm64@npm:0.14.31"
   conditions: os=win32 & cpu=arm64
   languageName: node
   linkType: hard
@@ -9883,30 +10093,101 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esbuild@npm:^0.14.14, esbuild@npm:^0.14.25, esbuild@npm:^0.14.27, esbuild@npm:^0.14.6":
-  version: 0.14.27
-  resolution: "esbuild@npm:0.14.27"
-  dependencies:
-    esbuild-android-64: 0.14.27
-    esbuild-android-arm64: 0.14.27
-    esbuild-darwin-64: 0.14.27
-    esbuild-darwin-arm64: 0.14.27
-    esbuild-freebsd-64: 0.14.27
-    esbuild-freebsd-arm64: 0.14.27
-    esbuild-linux-32: 0.14.27
-    esbuild-linux-64: 0.14.27
-    esbuild-linux-arm: 0.14.27
-    esbuild-linux-arm64: 0.14.27
-    esbuild-linux-mips64le: 0.14.27
-    esbuild-linux-ppc64le: 0.14.27
-    esbuild-linux-riscv64: 0.14.27
-    esbuild-linux-s390x: 0.14.27
-    esbuild-netbsd-64: 0.14.27
-    esbuild-openbsd-64: 0.14.27
-    esbuild-sunos-64: 0.14.27
-    esbuild-windows-32: 0.14.27
-    esbuild-windows-64: 0.14.27
-    esbuild-windows-arm64: 0.14.27
+"esbuild@npm:^0.14.25, esbuild@npm:^0.14.27, esbuild@npm:^0.14.6":
+  version: 0.14.29
+  resolution: "esbuild@npm:0.14.29"
+  dependencies:
+    esbuild-android-64: 0.14.29
+    esbuild-android-arm64: 0.14.29
+    esbuild-darwin-64: 0.14.29
+    esbuild-darwin-arm64: 0.14.29
+    esbuild-freebsd-64: 0.14.29
+    esbuild-freebsd-arm64: 0.14.29
+    esbuild-linux-32: 0.14.29
+    esbuild-linux-64: 0.14.29
+    esbuild-linux-arm: 0.14.29
+    esbuild-linux-arm64: 0.14.29
+    esbuild-linux-mips64le: 0.14.29
+    esbuild-linux-ppc64le: 0.14.29
+    esbuild-linux-riscv64: 0.14.29
+    esbuild-linux-s390x: 0.14.29
+    esbuild-netbsd-64: 0.14.29
+    esbuild-openbsd-64: 0.14.29
+    esbuild-sunos-64: 0.14.29
+    esbuild-windows-32: 0.14.29
+    esbuild-windows-64: 0.14.29
+    esbuild-windows-arm64: 0.14.29
+  dependenciesMeta:
+    esbuild-android-64:
+      optional: true
+    esbuild-android-arm64:
+      optional: true
+    esbuild-darwin-64:
+      optional: true
+    esbuild-darwin-arm64:
+      optional: true
+    esbuild-freebsd-64:
+      optional: true
+    esbuild-freebsd-arm64:
+      optional: true
+    esbuild-linux-32:
+      optional: true
+    esbuild-linux-64:
+      optional: true
+    esbuild-linux-arm:
+      optional: true
+    esbuild-linux-arm64:
+      optional: true
+    esbuild-linux-mips64le:
+      optional: true
+    esbuild-linux-ppc64le:
+      optional: true
+    esbuild-linux-riscv64:
+      optional: true
+    esbuild-linux-s390x:
+      optional: true
+    esbuild-netbsd-64:
+      optional: true
+    esbuild-openbsd-64:
+      optional: true
+    esbuild-sunos-64:
+      optional: true
+    esbuild-windows-32:
+      optional: true
+    esbuild-windows-64:
+      optional: true
+    esbuild-windows-arm64:
+      optional: true
+  bin:
+    esbuild: bin/esbuild
+  checksum: 3066b9f5bc33b56c22fa1b14f6fd6b7cee292858b042d5f9051c87e57472a134045e653526612ea75fa4dfed3ed767b80c35165b819b4f29d92bf2e69c5fe37d
+  languageName: node
+  linkType: hard
+
+"esbuild@npm:^0.14.31":
+  version: 0.14.31
+  resolution: "esbuild@npm:0.14.31"
+  dependencies:
+    esbuild-android-64: 0.14.31
+    esbuild-android-arm64: 0.14.31
+    esbuild-darwin-64: 0.14.31
+    esbuild-darwin-arm64: 0.14.31
+    esbuild-freebsd-64: 0.14.31
+    esbuild-freebsd-arm64: 0.14.31
+    esbuild-linux-32: 0.14.31
+    esbuild-linux-64: 0.14.31
+    esbuild-linux-arm: 0.14.31
+    esbuild-linux-arm64: 0.14.31
+    esbuild-linux-mips64le: 0.14.31
+    esbuild-linux-ppc64le: 0.14.31
+    esbuild-linux-riscv64: 0.14.31
+    esbuild-linux-s390x: 0.14.31
+    esbuild-netbsd-64: 0.14.31
+    esbuild-openbsd-64: 0.14.31
+    esbuild-sunos-64: 0.14.31
+    esbuild-windows-32: 0.14.31
+    esbuild-windows-64: 0.14.31
+    esbuild-windows-arm64: 0.14.31
   dependenciesMeta:
     esbuild-android-64:
       optional: true
@@ -9950,7 +10231,7 @@ __metadata:
       optional: true
   bin:
     esbuild: bin/esbuild
-  checksum: 19386ba13536ca69845989c981a44e006cf4aa79cf8186fe2af6fdb8f43f7b7ca708c443360fe18b455b4da71b473ad135bc3bc20b892485b2a27455d2287555
+  checksum: 6b846ed08919178e6b31b3e194511383d045e142a43050c0b8c4dfb59302569651257b98f4319b2f7c5ecf92888b7388546354ab7ec81a1412275bc8bba4a425
   languageName: node
   linkType: hard
 
@@ -10096,9 +10377,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"eslint-plugin-jsdoc@npm:^38.0.6":
-  version: 38.0.6
-  resolution: "eslint-plugin-jsdoc@npm:38.0.6"
+"eslint-plugin-jsdoc@npm:^38.1.6":
+  version: 38.1.6
+  resolution: "eslint-plugin-jsdoc@npm:38.1.6"
   dependencies:
     "@es-joy/jsdoccomment": ~0.22.1
     comment-parser: 1.3.1
@@ -10110,7 +10391,7 @@ __metadata:
     spdx-expression-parse: ^3.0.1
   peerDependencies:
     eslint: ^7.0.0 || ^8.0.0
-  checksum: 81c49a1949bf7d26d6ac30bb8b6277ce3dfc5e875325ac25798df1e3c0abfe254432e3747031f5eb97beedff60303570bd2c92a6b05c8435269510758d3ddfc2
+  checksum: 600dac3a9b81ac6fcb62a30a30e83a85a003ca3ecfe5376d99a1042ba703cfdf3ef404413c74a75f61c2a77e6cc7435628cfc51d80081108a67965ac238d14b4
   languageName: node
   linkType: hard
 
@@ -10248,9 +10529,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"eslint@npm:^8.11.0":
-  version: 8.11.0
-  resolution: "eslint@npm:8.11.0"
+"eslint@npm:^8.12.0":
+  version: 8.12.0
+  resolution: "eslint@npm:8.12.0"
   dependencies:
     "@eslint/eslintrc": ^1.2.1
     "@humanwhocodes/config-array": ^0.9.2
@@ -10289,7 +10570,7 @@ __metadata:
     v8-compile-cache: ^2.0.3
   bin:
     eslint: bin/eslint.js
-  checksum: a06a2ea37002d6c0a4f462fe31b4411185dc3da7857fafb896eb392ba95a1289cc3538056474b2f44f08012f265bede01a39d46df4ac39ebc6d7be90e2c8f9fa
+  checksum: 111bf9046b7a463049788dd00d7f4cd91e024029982352dff4811ce5dfa8cb1136aa127cd8a7a91508234d3e1b4fb6f638a1f5ef9ea08b1af93a18703a4a8dc1
   languageName: node
   linkType: hard
 
@@ -10427,188 +10708,198 @@ __metadata:
   languageName: node
   linkType: hard
 
-"example-config-extends@workspace:examples/config-extends":
+"example-components@workspace:examples/auto-imports/components":
   version: 0.0.0-use.local
-  resolution: "example-config-extends@workspace:examples/config-extends"
+  resolution: "example-components@workspace:examples/auto-imports/components"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-hello-world@workspace:examples/hello-world":
+"example-composables@workspace:examples/auto-imports/composables":
   version: 0.0.0-use.local
-  resolution: "example-hello-world@workspace:examples/hello-world"
+  resolution: "example-composables@workspace:examples/auto-imports/composables"
   dependencies:
+    "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-locale@workspace:examples/locale":
+"example-config-extends@workspace:examples/advanced/config-extends":
   version: 0.0.0-use.local
-  resolution: "example-locale@workspace:examples/locale"
+  resolution: "example-config-extends@workspace:examples/advanced/config-extends"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-module-extend-pages@workspace:examples/module-extend-pages":
+"example-error-handling@workspace:examples/app/error-handling":
   version: 0.0.0-use.local
-  resolution: "example-module-extend-pages@workspace:examples/module-extend-pages"
+  resolution: "example-error-handling@workspace:examples/app/error-handling"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-nuxt-link@workspace:examples/nuxt-link":
+"example-hello-world@workspace:examples/essentials/hello-world":
   version: 0.0.0-use.local
-  resolution: "example-nuxt-link@workspace:examples/nuxt-link"
+  resolution: "example-hello-world@workspace:examples/essentials/hello-world"
   dependencies:
-    "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-use-async-data@workspace:examples/use-async-data":
+"example-layouts@workspace:examples/routing/layouts":
   version: 0.0.0-use.local
-  resolution: "example-use-async-data@workspace:examples/use-async-data"
+  resolution: "example-layouts@workspace:examples/routing/layouts"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-use-cookie@workspace:examples/use-cookie":
+"example-locale@workspace:examples/other/locale":
   version: 0.0.0-use.local
-  resolution: "example-use-cookie@workspace:examples/use-cookie"
+  resolution: "example-locale@workspace:examples/other/locale"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-use-fetch@workspace:examples/use-fetch":
+"example-middleware@workspace:examples/routing/middleware":
   version: 0.0.0-use.local
-  resolution: "example-use-fetch@workspace:examples/use-fetch"
+  resolution: "example-middleware@workspace:examples/routing/middleware"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-use-meta@workspace:examples/use-meta":
+"example-module-extend-pages@workspace:examples/advanced/module-extend-pages":
   version: 0.0.0-use.local
-  resolution: "example-use-meta@workspace:examples/use-meta"
+  resolution: "example-module-extend-pages@workspace:examples/advanced/module-extend-pages"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-use-state@workspace:examples/use-state":
+"example-nuxt-link@workspace:examples/routing/nuxt-link":
   version: 0.0.0-use.local
-  resolution: "example-use-state@workspace:examples/use-state"
+  resolution: "example-nuxt-link@workspace:examples/routing/nuxt-link"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-components@workspace:examples/with-components":
+"example-pages@workspace:examples/routing/pages":
   version: 0.0.0-use.local
-  resolution: "example-with-components@workspace:examples/with-components"
+  resolution: "example-pages@workspace:examples/routing/pages"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-composables@workspace:examples/with-composables":
+"example-plugins@workspace:examples/app/plugins":
   version: 0.0.0-use.local
-  resolution: "example-with-composables@workspace:examples/with-composables"
+  resolution: "example-plugins@workspace:examples/app/plugins"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-errors@workspace:examples/with-errors":
+"example-reactivity-transform@workspace:examples/experimental/reactivity-transform":
   version: 0.0.0-use.local
-  resolution: "example-with-errors@workspace:examples/with-errors"
+  resolution: "example-reactivity-transform@workspace:examples/experimental/reactivity-transform"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-layouts@workspace:examples/with-layouts":
+"example-teleport@workspace:examples/app/teleport":
   version: 0.0.0-use.local
-  resolution: "example-with-layouts@workspace:examples/with-layouts"
+  resolution: "example-teleport@workspace:examples/app/teleport"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-middleware@workspace:examples/with-middleware":
+"example-test@workspace:examples/advanced/test":
+  version: 0.0.0-use.local
+  resolution: "example-test@workspace:examples/advanced/test"
+  dependencies:
+    nuxt3: latest
+  languageName: unknown
+  linkType: soft
+
+"example-universal-router@workspace:examples/routing/universal-router":
   version: 0.0.0-use.local
-  resolution: "example-with-middleware@workspace:examples/with-middleware"
+  resolution: "example-universal-router@workspace:examples/routing/universal-router"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-pages@workspace:examples/with-pages":
+"example-use-async-data@workspace:examples/composables/use-async-data":
   version: 0.0.0-use.local
-  resolution: "example-with-pages@workspace:examples/with-pages"
+  resolution: "example-use-async-data@workspace:examples/composables/use-async-data"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-plugins@workspace:examples/with-plugins":
+"example-use-cookie@workspace:examples/composables/use-cookie":
   version: 0.0.0-use.local
-  resolution: "example-with-plugins@workspace:examples/with-plugins"
+  resolution: "example-use-cookie@workspace:examples/composables/use-cookie"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-reactivity-transform@workspace:examples/with-reactivity-transform":
+"example-use-fetch@workspace:examples/composables/use-fetch":
   version: 0.0.0-use.local
-  resolution: "example-with-reactivity-transform@workspace:examples/with-reactivity-transform"
+  resolution: "example-use-fetch@workspace:examples/composables/use-fetch"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-test@workspace:examples/with-test":
+"example-use-meta@workspace:examples/composables/use-meta":
   version: 0.0.0-use.local
-  resolution: "example-with-test@workspace:examples/with-test"
+  resolution: "example-use-meta@workspace:examples/composables/use-meta"
   dependencies:
+    "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-universal-router@workspace:examples/with-universal-router":
+"example-use-state@workspace:examples/composables/use-state":
   version: 0.0.0-use.local
-  resolution: "example-with-universal-router@workspace:examples/with-universal-router"
+  resolution: "example-use-state@workspace:examples/composables/use-state"
   dependencies:
     "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
 
-"example-with-wasm@workspace:examples/with-wasm":
+"example-wasm@workspace:examples/experimental/wasm":
   version: 0.0.0-use.local
-  resolution: "example-with-wasm@workspace:examples/with-wasm"
+  resolution: "example-wasm@workspace:examples/experimental/wasm"
   dependencies:
+    "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
@@ -11334,8 +11625,8 @@ __metadata:
   linkType: hard
 
 "gauge@npm:^4.0.0":
-  version: 4.0.3
-  resolution: "gauge@npm:4.0.3"
+  version: 4.0.4
+  resolution: "gauge@npm:4.0.4"
   dependencies:
     aproba: ^1.0.3 || ^2.0.0
     color-support: ^1.1.3
@@ -11345,7 +11636,7 @@ __metadata:
     string-width: ^4.2.3
     strip-ansi: ^6.0.1
     wide-align: ^1.1.5
-  checksum: baf982238a5270def90a4895f2e083b5cf8e6f7df20b53b24a932845aec363a6cf411f88b33dcb016a43c9334fdfccd956e4514ee875d70af016bf6fead3d3ae
+  checksum: 788b6bfe52f1dd8e263cda800c26ac0ca2ff6de0b6eee2fe0d9e3abf15e149b651bd27bf5226be10e6e3edb5c4e5d5985a5a1a98137e7a892f75eff76467ad2d
   languageName: node
   linkType: hard
 
@@ -11696,7 +11987,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"h3@npm:^0.4.1, h3@npm:^0.4.2":
+"h3@npm:^0.4.2":
   version: 0.4.2
   resolution: "h3@npm:0.4.2"
   dependencies:
@@ -11708,6 +11999,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"h3@npm:^0.5.3":
+  version: 0.5.3
+  resolution: "h3@npm:0.5.3"
+  dependencies:
+    cookie-es: ^0.5.0
+    destr: ^1.1.0
+    radix3: ^0.1.1
+    ufo: ^0.7.11
+  checksum: 1bf0a0b30014b4db1dc913d4a4c548885ac62cc59f40d6e534d9137a6f366e0ef9ff9b5ec4615cb24e1920fc19757014267363a8c8318f4de640bb9a92cec01f
+  languageName: node
+  linkType: hard
+
 "hable@npm:^3.0.0":
   version: 3.0.0
   resolution: "hable@npm:3.0.0"
@@ -11810,7 +12113,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"has-symbols@npm:^1.0.1, has-symbols@npm:^1.0.2":
+"has-symbols@npm:^1.0.1, has-symbols@npm:^1.0.2, has-symbols@npm:^1.0.3":
   version: 1.0.3
   resolution: "has-symbols@npm:1.0.3"
   checksum: a054c40c631c0d5741a8285010a0777ea0c068f99ed43e5d6eb12972da223f8af553a455132fdb0801bdcfa0e0f443c0c03a68d8555aa529b3144b446c3f2410
@@ -12005,9 +12308,9 @@ __metadata:
   linkType: hard
 
 "html-entities@npm:^2.1.0":
-  version: 2.3.2
-  resolution: "html-entities@npm:2.3.2"
-  checksum: 522d8d202df301ff51b517a379e642023ed5c81ea9fb5674ffad88cff386165733d00b6089d5c2fcc644e44777d6072017b6216d8fa40f271d3610420d00a886
+  version: 2.3.3
+  resolution: "html-entities@npm:2.3.3"
+  checksum: 92521501da8aa5f66fee27f0f022d6e9ceae62667dae93aa6a2f636afa71ad530b7fb24a18d4d6c124c9885970cac5f8a52dbf1731741161002816ae43f98196
   languageName: node
   linkType: hard
 
@@ -12775,7 +13078,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-negative-zero@npm:^2.0.1":
+"is-negative-zero@npm:^2.0.2":
   version: 2.0.2
   resolution: "is-negative-zero@npm:2.0.2"
   checksum: f3232194c47a549da60c3d509c9a09be442507616b69454716692e37ae9f37c4dea264fb208ad0c9f3efd15a796a46b79df07c7e53c6227c32170608b809149a
@@ -12968,7 +13271,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-weakref@npm:^1.0.1":
+"is-weakref@npm:^1.0.2":
   version: 1.0.2
   resolution: "is-weakref@npm:1.0.2"
   dependencies:
@@ -13763,9 +14066,9 @@ __metadata:
   linkType: hard
 
 "lru-cache@npm:^7.7.1":
-  version: 7.7.1
-  resolution: "lru-cache@npm:7.7.1"
-  checksum: f362c5a2cfa8ad6fe557ec43dc1b7a9695cce84a5652a43ff813609f782f5da576631e7dfad41878bf19a7a69438f38375178635ee80de269aa314280ca2f59e
+  version: 7.7.3
+  resolution: "lru-cache@npm:7.7.3"
+  checksum: 1789743a68a8db052564a9dd020f04ba0712327a43e08babc94f05e1c56ef75a03514cf4acab75ae90e3d5d16ae02c7bf0f34754968dc5b8c2c3bc2d92c21745
   languageName: node
   linkType: hard
 
@@ -13816,8 +14119,8 @@ __metadata:
   linkType: hard
 
 "make-fetch-happen@npm:^10.0.3":
-  version: 10.1.0
-  resolution: "make-fetch-happen@npm:10.1.0"
+  version: 10.1.1
+  resolution: "make-fetch-happen@npm:10.1.1"
   dependencies:
     agentkeepalive: ^4.2.1
     cacache: ^16.0.2
@@ -13835,7 +14138,7 @@ __metadata:
     promise-retry: ^2.0.1
     socks-proxy-agent: ^6.1.1
     ssri: ^8.0.1
-  checksum: fae1c2f255f6467bf6731344c2c04dd0e1f1899d8ae4698d98e2c86131ba899a418746ebc564493b85d1651d43c93b49f7825a2773edda4285a1c4c5e5ba9168
+  checksum: 3f1b0acc2032061a01bb44458e07bbd5721e3fbfb5a1620eef38e7c7d022f2141373fc41a8056685441c70444d94e1479485492ac6e9e8ad5de87ea29ca9d9e4
   languageName: node
   linkType: hard
 
@@ -14670,11 +14973,11 @@ __metadata:
   linkType: hard
 
 "nanoid@npm:^3.1.23, nanoid@npm:^3.1.32, nanoid@npm:^3.3.1":
-  version: 3.3.1
-  resolution: "nanoid@npm:3.3.1"
+  version: 3.3.2
+  resolution: "nanoid@npm:3.3.2"
   bin:
     nanoid: bin/nanoid.cjs
-  checksum: 4ef0969e1bbe866fc223eb32276cbccb0961900bfe79104fa5abe34361979dead8d0e061410a5c03bc3d47455685adf32c09d6f27790f4a6898fb51f7df7ec86
+  checksum: 376717f0685251fad77850bd84c6b8d57837c71eeb1c05be7c742140cc1835a5a2953562add05166d6dbc8fb65f3fdffa356213037b967a470e1691dc3e7b9cc
   languageName: node
   linkType: hard
 
@@ -14732,8 +15035,8 @@ __metadata:
   linkType: hard
 
 "nitropack@npm:nitropack-edge@latest":
-  version: 0.0.0-27456183.d13b842
-  resolution: "nitropack-edge@npm:0.0.0-27456183.d13b842"
+  version: 0.0.0-27479281.32ff5e4
+  resolution: "nitropack-edge@npm:0.0.0-27479281.32ff5e4"
   dependencies:
     "@cloudflare/kv-asset-handler": ^0.2.0
     "@netlify/functions": ^1.0.0
@@ -14763,12 +15066,13 @@ __metadata:
     fs-extra: ^10.0.1
     globby: ^13.1.1
     gzip-size: ^7.0.0
-    h3: ^0.4.1
+    h3: ^0.5.3
     hasha: ^5.2.2
     hookable: ^5.1.1
     http-proxy: ^1.18.1
     is-primitive: ^3.0.1
     jiti: ^1.13.0
+    klona: ^2.0.5
     listhen: ^0.2.6
     mime: ^3.0.0
     mlly: ^0.4.3
@@ -14777,14 +15081,15 @@ __metadata:
     object-hash: ^3.0.0
     ohmyfetch: ^0.4.15
     ora: ^6.1.0
-    p-debounce: ^4.0.0
     pathe: ^0.2.0
+    perfect-debounce: ^0.1.3
     pkg-types: ^0.3.2
     pretty-bytes: ^6.0.0
     rollup: ^2.70.1
     rollup-plugin-terser: ^7.0.2
     rollup-plugin-visualizer: ^5.6.0
     scule: ^0.2.1
+    semver: ^7.3.5
     serve-placeholder: ^1.2.4
     serve-static: ^1.14.2
     std-env: ^3.0.1
@@ -14796,7 +15101,7 @@ __metadata:
   bin:
     nitro: ./dist/cli.mjs
     nitropack: ./dist/cli.mjs
-  checksum: 32a7525695c6f070788b631dfa7a575bef0e4d7f237a17a2e1bffc0578b060ce5f1986e5b549fb6233effaa1b6d8415a45de739b6ee3b898bea8669a613d00a1
+  checksum: c23a7606d1a8e37bd8202d9f328eef281131f7ecdd34eae171f8138e5b0b36a9911bd98077997332d9afcbd73576a3eac6329ff9932cc055c3a077da427c26cb
   languageName: node
   linkType: hard
 
@@ -14847,7 +15152,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"node-fetch@npm:^2.6.1, node-fetch@npm:^2.6.5, node-fetch@npm:^2.6.6, node-fetch@npm:^2.6.7":
+"node-fetch@npm:^2.6.1, node-fetch@npm:^2.6.6, node-fetch@npm:^2.6.7":
   version: 2.6.7
   resolution: "node-fetch@npm:2.6.7"
   dependencies:
@@ -14868,21 +15173,21 @@ __metadata:
   languageName: node
   linkType: hard
 
-"node-forge@npm:^1.2.0":
-  version: 1.3.0
-  resolution: "node-forge@npm:1.3.0"
-  checksum: 3d8124168dd82006fafbb079f40a529afa0de5bf4d77e6a5a471877e9d39bece31fdc8339e8aee30d5480dc79ffcd1059cfcb21983d350dd3f2a9f226db6ca85
+"node-forge@npm:^1":
+  version: 1.3.1
+  resolution: "node-forge@npm:1.3.1"
+  checksum: 08fb072d3d670599c89a1704b3e9c649ff1b998256737f0e06fbd1a5bf41cae4457ccaee32d95052d80bbafd9ffe01284e078c8071f0267dc9744e51c5ed42a9
   languageName: node
   linkType: hard
 
 "node-gyp-build@npm:^4.2.2":
-  version: 4.3.0
-  resolution: "node-gyp-build@npm:4.3.0"
+  version: 4.4.0
+  resolution: "node-gyp-build@npm:4.4.0"
   bin:
     node-gyp-build: bin.js
     node-gyp-build-optional: optional.js
     node-gyp-build-test: build-test.js
-  checksum: 1ecab16d9f275174d516e223f60f65ebe07540347d5c04a6a7d6921060b7f2e3af4f19463d9d1dcedc452e275c2ae71354a99405e55ebd5b655bb2f38025c728
+  checksum: 972a059f960253d254e0b23ce10f54c8982236fc0edcab85166d0b7f87443b2ce98391c877cfb2f6eeafcf03c538c5f4dd3e0bfff03828eb48634f58f4c64343
   languageName: node
   linkType: hard
 
@@ -15357,6 +15662,7 @@ __metadata:
     "@types/mri": ^1.1.1
     "@types/rimraf": ^3
     "@types/semver": ^7
+    c12: ^0.2.4
     chokidar: ^3.5.3
     clear: ^0.1.0
     clipboardy: ^3.0.0
@@ -15418,16 +15724,15 @@ __metadata:
   resolution: "nuxt-framework@workspace:."
   dependencies:
     "@iconify-json/carbon": ^1.1.2
-    "@nuxt/ui": ^0.0.0-alpha.5
     "@nuxtjs/eslint-config": ^9.0.0
     "@nuxtjs/eslint-config-typescript": ^9.0.0
     "@types/jsdom": ^16
     "@types/node": ^16.11.26
     "@types/object-hash": ^2
-    "@unocss/reset": ^0.30.3
-    esbuild: ^0.14.27
-    eslint: ^8.11.0
-    eslint-plugin-jsdoc: ^38.0.6
+    "@unocss/reset": ^0.30.11
+    esbuild: ^0.14.31
+    eslint: ^8.12.0
+    eslint-plugin-jsdoc: ^38.1.6
     execa: ^6.1.0
     expect-type: ^0.13.0
     globby: ^13.1.1
@@ -15439,7 +15744,7 @@ __metadata:
     pathe: ^0.2.0
     typescript: ^4.6.3
     unbuild: ^0.7.2
-    vitest: ^0.7.11
+    vitest: ^0.8.4
     vue-router: ^4.0.14
     vue-tsc: ^0.33.9
   languageName: unknown
@@ -15449,7 +15754,6 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "nuxt-playground@workspace:playground"
   dependencies:
-    "@nuxt/ui": "npm:@nuxt/ui-edge@latest"
     nuxt3: latest
   languageName: unknown
   linkType: soft
@@ -15488,11 +15792,12 @@ __metadata:
     pathe: ^0.2.0
     perfect-debounce: ^0.1.3
     scule: ^0.2.1
-    ufo: ^0.8.1
+    ufo: ^0.8.3
     unbuild: latest
+    unctx: ^1.1.4
     unimport: ^0.1.3
-    unplugin: ^0.6.0
-    untyped: ^0.4.3
+    unplugin: ^0.6.1
+    untyped: ^0.4.4
     vue: ^3.2.31
     vue-meta: next
     vue-router: ^4.0.14
@@ -15559,7 +15864,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"object-inspect@npm:^1.11.0, object-inspect@npm:^1.9.0":
+"object-inspect@npm:^1.12.0, object-inspect@npm:^1.9.0":
   version: 1.12.0
   resolution: "object-inspect@npm:1.12.0"
   checksum: 2b36d4001a9c921c6b342e2965734519c9c58c355822243c3207fbf0aac271f8d44d30d2d570d450b2cc6f0f00b72bcdba515c37827d2560e5f22b1899a31cf4
@@ -15799,13 +16104,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"p-debounce@npm:^4.0.0":
-  version: 4.0.0
-  resolution: "p-debounce@npm:4.0.0"
-  checksum: 7f796f6ed264cb964b83601e70c4c0d94dd52d54e1361400ee80df7527217a59074aa14ab746d4d3089b352181c4ffb5329158fd679cb4b4b52c208574e9e56d
-  languageName: node
-  linkType: hard
-
 "p-defer@npm:^1.0.0":
   version: 1.0.0
   resolution: "p-defer@npm:1.0.0"
@@ -16339,9 +16637,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"playwright-core@npm:1.20.1":
-  version: 1.20.1
-  resolution: "playwright-core@npm:1.20.1"
+"playwright-core@npm:1.20.2":
+  version: 1.20.2
+  resolution: "playwright-core@npm:1.20.2"
   dependencies:
     colors: 1.4.0
     commander: 8.3.0
@@ -16363,18 +16661,18 @@ __metadata:
     yazl: 2.5.1
   bin:
     playwright: cli.js
-  checksum: a436eff4cfb88a68d6c2da7941c0ace35f940f885f97c125e1a0103e4601f1be313eada81283f1208d5cded57a841482f743526fc3960c5f2a383b08220401de
+  checksum: 156c2c8729f1e1a454f348a4e362bb6fff7b7fb7a5e5886828afeb9b29c2fae5dff5c3060a9d4a41f5c191aef0532a73513cfb4f2d2c357f1fe240640b28ca14
   languageName: node
   linkType: hard
 
-"playwright@npm:^1.20.1":
-  version: 1.20.1
-  resolution: "playwright@npm:1.20.1"
+"playwright@npm:^1.20.2":
+  version: 1.20.2
+  resolution: "playwright@npm:1.20.2"
   dependencies:
-    playwright-core: 1.20.1
+    playwright-core: 1.20.2
   bin:
     playwright: cli.js
-  checksum: cf16309063467aa7dcccbef1fd4bacd19aa83827320ddd4806a0b9676f4cf683aae0a7cf9c73cf43ae99db02b16d5019c039c98fe811394d537be3a1331ea314
+  checksum: f92a2a59999a5ff55959f3dd351cc8724818276637df57efe84b5ccc0676ff38d70f2553b4aabfb4bdc05cb0895ed09616eb1d60407ba62fddbc7dd404926dcc
   languageName: node
   linkType: hard
 
@@ -17096,6 +17394,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"postcss-merge-longhand@npm:^5.1.4":
+  version: 5.1.4
+  resolution: "postcss-merge-longhand@npm:5.1.4"
+  dependencies:
+    postcss-value-parser: ^4.2.0
+    stylehacks: ^5.1.0
+  peerDependencies:
+    postcss: ^8.2.15
+  checksum: 3245531aebcd0d2fe6982e142c088ae96ed5242885349e6160e68fc007cdc10d8b0f3e57d7987e3ba07fc9f7d0f6f278972fecaa517c0fa8594bdeaed82393f0
+  languageName: node
+  linkType: hard
+
 "postcss-merge-rules@npm:^4.0.3":
   version: 4.0.3
   resolution: "postcss-merge-rules@npm:4.0.3"
@@ -17848,12 +18158,12 @@ __metadata:
   linkType: hard
 
 "postcss-selector-parser@npm:^6.0.0, postcss-selector-parser@npm:^6.0.2, postcss-selector-parser@npm:^6.0.4, postcss-selector-parser@npm:^6.0.5, postcss-selector-parser@npm:^6.0.9":
-  version: 6.0.9
-  resolution: "postcss-selector-parser@npm:6.0.9"
+  version: 6.0.10
+  resolution: "postcss-selector-parser@npm:6.0.10"
   dependencies:
     cssesc: ^3.0.0
     util-deprecate: ^1.0.2
-  checksum: f8161ab4d3e5c76b8467189c6d164ba0f6b6e74677435f29e34caa1df01e052b582b4ae4f7468b2243c4befdd8bdcdb7685542d1b2fca8deae21b3e849c78802
+  checksum: 46afaa60e3d1998bd7adf6caa374baf857cc58d3ff944e29459c9a9e4680a7fe41597bd5b755fc81d7c388357e9bf67c0251d047c640a09f148e13606b8a8608
   languageName: node
   linkType: hard
 
@@ -17964,7 +18274,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"postcss@npm:^8, postcss@npm:^8.1.10, postcss@npm:^8.2.15, postcss@npm:^8.3.5, postcss@npm:^8.4.12, postcss@npm:^8.4.6, postcss@npm:^8.4.7":
+"postcss@npm:^8, postcss@npm:^8.1.10, postcss@npm:^8.2.15, postcss@npm:^8.3.5, postcss@npm:^8.4.12, postcss@npm:^8.4.7":
   version: 8.4.12
   resolution: "postcss@npm:8.4.12"
   dependencies:
@@ -19242,11 +19552,11 @@ __metadata:
   linkType: hard
 
 "selfsigned@npm:^2.0.0":
-  version: 2.0.0
-  resolution: "selfsigned@npm:2.0.0"
+  version: 2.0.1
+  resolution: "selfsigned@npm:2.0.1"
   dependencies:
-    node-forge: ^1.2.0
-  checksum: 43fca39a5aded2a8e97c1756af74c049a9dde12d47d302820f7d507d25c2ad7da4b04bc439a36620d63b4c0149bcf34ae7a729f978bf3b1bf48859c36ae34cee
+    node-forge: ^1
+  checksum: 864e65c2f31ca877bce3ccdaa3bdef5e1e992b63b2a03641e00c24cd305bf2acce093431d1fed2e5ae9f526558db4be5e90baa2b3474c0428fcf7e25cc86ac93
   languageName: node
   linkType: hard
 
@@ -20846,9 +21156,9 @@ __metadata:
   linkType: hard
 
 "type-fest@npm:^2.11.2":
-  version: 2.12.1
-  resolution: "type-fest@npm:2.12.1"
-  checksum: faac07668190b7709c16ba4696e42b6cc83b702fa11e8936ce94d9ed1415eb9034b157ae25bba23e222d755e031787f7b92552710704d55e39aadcc27f0ee1da
+  version: 2.12.2
+  resolution: "type-fest@npm:2.12.2"
+  checksum: ee69676da1f69d2b14bbec28c7b95220a3221ab14093f54bde179c59e185a80470859553eada535ec35d8637a245c2f0efe9d7c99cc46a43f3b4c7ef64db7957
   languageName: node
   linkType: hard
 
@@ -20941,10 +21251,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ufo@npm:^0.8.1":
-  version: 0.8.1
-  resolution: "ufo@npm:0.8.1"
-  checksum: dbdb779f901da1036f501ef65a71797c44763285a449cfc0497a8fee0421bf0e7e38fa6a5b461cca079e63efca80da5013fcdcd180ec6095912761944d107763
+"ufo@npm:^0.8.3":
+  version: 0.8.3
+  resolution: "ufo@npm:0.8.3"
+  checksum: 7ea20e9d0fbd92b3310de4b020919f0a0542db60a6787ccecf232285d55795ddc0ea482b04d6c07cac60367a294aee705d888999867a5c3c69e47ed8d0ae3009
   languageName: node
   linkType: hard
 
@@ -21020,7 +21330,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"unconfig@npm:^0.3.1":
+"unconfig@npm:^0.3.2":
   version: 0.3.2
   resolution: "unconfig@npm:0.3.2"
   dependencies:
@@ -21031,15 +21341,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"unctx@npm:^1.1.2":
-  version: 1.1.2
-  resolution: "unctx@npm:1.1.2"
+"unctx@npm:^1.1.4":
+  version: 1.1.4
+  resolution: "unctx@npm:1.1.4"
   dependencies:
     acorn: ^8.7.0
     estree-walker: ^2.0.2
     magic-string: ^0.26.1
-    unplugin: ^0.5.2
-  checksum: 49fc599af321a2dcbec16be8c51cc1400ff901e8ac9caa343e23d3e7727069834fbc3956377686350e513c325cb146e913c95f090596e95ca7ab18fca4c3064d
+    unplugin: ^0.6.1
+  checksum: 5b42fae7af0ab02279a313d14ac9df6026a758e44692c384781b1a4e198396bb7f3f31b9291f6fb9669cc485e81716ac228c245d5d3a40a43f6d917818137257
   languageName: node
   linkType: hard
 
@@ -21203,24 +21513,24 @@ __metadata:
   languageName: node
   linkType: hard
 
-"unocss@npm:0.28.3, unocss@npm:^0.28.1":
-  version: 0.28.3
-  resolution: "unocss@npm:0.28.3"
+"unocss@npm:0.30.8, unocss@npm:^0.30.8":
+  version: 0.30.8
+  resolution: "unocss@npm:0.30.8"
   dependencies:
-    "@unocss/cli": 0.28.3
-    "@unocss/core": 0.28.3
-    "@unocss/preset-attributify": 0.28.3
-    "@unocss/preset-icons": 0.28.3
-    "@unocss/preset-mini": 0.28.3
-    "@unocss/preset-typography": 0.28.3
-    "@unocss/preset-uno": 0.28.3
-    "@unocss/preset-web-fonts": 0.28.3
-    "@unocss/preset-wind": 0.28.3
-    "@unocss/reset": 0.28.3
-    "@unocss/transformer-directives": 0.28.3
-    "@unocss/transformer-variant-group": 0.28.3
-    "@unocss/vite": 0.28.3
-  checksum: a6000dbcafa9398c9aacc22e6d44f77e9086a6f3be1203302aa2c7fe57ded66f6bfb35a5b47031d5eced23927740abe7f934374801cf10803081fc44e7ccd16e
+    "@unocss/cli": 0.30.8
+    "@unocss/core": 0.30.8
+    "@unocss/preset-attributify": 0.30.8
+    "@unocss/preset-icons": 0.30.8
+    "@unocss/preset-mini": 0.30.8
+    "@unocss/preset-typography": 0.30.8
+    "@unocss/preset-uno": 0.30.8
+    "@unocss/preset-web-fonts": 0.30.8
+    "@unocss/preset-wind": 0.30.8
+    "@unocss/reset": 0.30.8
+    "@unocss/transformer-directives": 0.30.8
+    "@unocss/transformer-variant-group": 0.30.8
+    "@unocss/vite": 0.30.8
+  checksum: 8ead3a6e786fd51a1e55abd4a78da99bdb71384f26b6868b6c5f576f1abbd1f8bd3a4d8ce4ef095f82a1514f7b589fed7f2111fd87bdf1bdcfaba9b982eeea8a
   languageName: node
   linkType: hard
 
@@ -21231,9 +21541,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"unplugin-vue2-script-setup@npm:^0.10.0":
-  version: 0.10.0
-  resolution: "unplugin-vue2-script-setup@npm:0.10.0"
+"unplugin-vue2-script-setup@npm:^0.10.2":
+  version: 0.10.2
+  resolution: "unplugin-vue2-script-setup@npm:0.10.2"
   dependencies:
     "@antfu/utils": ^0.5.0
     "@babel/core": ^7.17.5
@@ -21256,7 +21566,7 @@ __metadata:
   peerDependenciesMeta:
     pug:
       optional: true
-  checksum: 4fa70dece8bd266eda63bb3607dd7148a5274bda585c3bf1a51ec7b7def4ab3ee5025c689d4b7efa72b4c56447f6527a444b78b333182e89b84ad03f2794b3c6
+  checksum: 934bcaf8a43d4cd0063a052171f68534d06a4b314af125efeda278660a79326510cb84c3957353a2a9b7ad51afa632b611224650c0642e3cb8ec41e46a45c05b
   languageName: node
   linkType: hard
 
@@ -21283,58 +21593,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"unplugin@npm:^0.4.0":
-  version: 0.4.0
-  resolution: "unplugin@npm:0.4.0"
-  dependencies:
-    chokidar: ^3.5.3
-    webpack-virtual-modules: ^0.4.3
-  peerDependencies:
-    esbuild: ">=0.13"
-    rollup: ^2.50.0
-    vite: ^2.3.0
-    webpack: 4 || 5
-  peerDependenciesMeta:
-    esbuild:
-      optional: true
-    rollup:
-      optional: true
-    vite:
-      optional: true
-    webpack:
-      optional: true
-  checksum: f5d26c2cd30ba1cd248e3734579d718b8bcbda8f4c99bfa4408c7839845cf9ec3af35f47eb0a1fda99a632679c3f2a2c96a33f2fc536756129bd25338a0f93d5
-  languageName: node
-  linkType: hard
-
-"unplugin@npm:^0.5.2":
-  version: 0.5.2
-  resolution: "unplugin@npm:0.5.2"
-  dependencies:
-    chokidar: ^3.5.3
-    webpack-sources: ^3.2.3
-    webpack-virtual-modules: ^0.4.3
-  peerDependencies:
-    esbuild: ">=0.13"
-    rollup: ^2.50.0
-    vite: ^2.3.0
-    webpack: 4 || 5
-  peerDependenciesMeta:
-    esbuild:
-      optional: true
-    rollup:
-      optional: true
-    vite:
-      optional: true
-    webpack:
-      optional: true
-  checksum: d36d7c3bc1327dc119fa797e752bfede3fec2d8ca47c6d08506d6b20c542739ba6df8820c0b1cfef90cda462abe8c1a4f6ba304ce989e9eaa2c80f66a1abe679
-  languageName: node
-  linkType: hard
-
-"unplugin@npm:^0.6.0":
-  version: 0.6.0
-  resolution: "unplugin@npm:0.6.0"
+"unplugin@npm:^0.6.0, unplugin@npm:^0.6.1":
+  version: 0.6.1
+  resolution: "unplugin@npm:0.6.1"
   dependencies:
     chokidar: ^3.5.3
     webpack-sources: ^3.2.3
@@ -21353,7 +21614,7 @@ __metadata:
       optional: true
     webpack:
       optional: true
-  checksum: 33e0d033f984f9013df72fd810ac5a6c803bbb6f2506cd2c711f0d72942698fe781a22a1c60f13a470d547caf9ec645eda42e3dcd102551326daf38f3bd682b5
+  checksum: ece0552cef85fc042ffd91d26554b4d66bde7270551d21acfc7ec556134bd59a99785e427be395b85fefad1db9dea4e3769f281cf413bde846ec23782e715d88
   languageName: node
   linkType: hard
 
@@ -21392,15 +21653,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"untyped@npm:^0.4.0, untyped@npm:^0.4.3":
-  version: 0.4.3
-  resolution: "untyped@npm:0.4.3"
+"untyped@npm:^0.4.0, untyped@npm:^0.4.4":
+  version: 0.4.4
+  resolution: "untyped@npm:0.4.4"
   dependencies:
     "@babel/core": ^7.17.7
     "@babel/standalone": ^7.17.7
     "@babel/types": ^7.17.0
     scule: ^0.2.1
-  checksum: 9d4b2945dc50fe11268dad37e7cb9e7ebbb43ca7205b1f6803811868fec2fed90b61d8ddc2e87785d53b95db659f5caec1976796daf9e2bd3bf6c9e3aa8cf097
+  checksum: 674506884b49d8648a96ac54791f7f29b1d14c28e3efc5fdd973c4a44ae6d3ad38a0b8ad0198e70fa223760491309822fb403e7a0bc6b28aa43eca31b717305e
   languageName: node
   linkType: hard
 
@@ -21626,18 +21887,18 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vite-node@npm:^0.7.11":
-  version: 0.7.11
-  resolution: "vite-node@npm:0.7.11"
+"vite-node@npm:^0.8.4":
+  version: 0.8.4
+  resolution: "vite-node@npm:0.8.4"
   dependencies:
     kolorist: ^1.5.1
-    minimist: ^1.2.5
-    mlly: ^0.4.3
+    minimist: ^1.2.6
+    mlly: ^0.5.1
     pathe: ^0.2.0
     vite: ^2.8.6
   bin:
     vite-node: vite-node.mjs
-  checksum: a83fe60905413fc4a518dbf133329e0556bbda62f91e137fd5ed9e6ae9a74aa2b9dd26f50cfec20b628132d77545b5e1f995a150452a35c4f48f2cdfa1ced070
+  checksum: bc2c07b6b7a301692a87709671c63e9b62270d9f4460e4bf532e96b713fedacdfac7e62ec23a7e10bea342b66ecded7a07b1ed8e8b971e7b2d2cc74e38b33546
   languageName: node
   linkType: hard
 
@@ -21672,13 +21933,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vite@npm:^2.8.6":
-  version: 2.8.6
-  resolution: "vite@npm:2.8.6"
+"vite@npm:^2.9.1":
+  version: 2.9.1
+  resolution: "vite@npm:2.9.1"
   dependencies:
-    esbuild: ^0.14.14
+    esbuild: ^0.14.27
     fsevents: ~2.3.2
-    postcss: ^8.4.6
+    postcss: ^8.4.12
     resolve: ^1.22.0
     rollup: ^2.59.0
   peerDependencies:
@@ -21697,13 +21958,13 @@ __metadata:
       optional: true
   bin:
     vite: bin/vite.js
-  checksum: 4b02d133892c98362c10214b7ad518d74b59745889197a2ba0b63260ed083fcef75a447e8fb58dbd2af8747386274b36017983d93031254df6ead38701950dcc
+  checksum: 0f0ac9337fa5c17faa4a59831a2df17475563b23a6162e86b2b60b19835ca1277f3249ea7a6608880354b39caf05779e9bad1e3b1f5b27010deced224aae47ea
   languageName: node
   linkType: hard
 
-"vitest@npm:^0.7.11":
-  version: 0.7.11
-  resolution: "vitest@npm:0.7.11"
+"vitest@npm:^0.8.4":
+  version: 0.8.4
+  resolution: "vitest@npm:0.8.4"
   dependencies:
     "@types/chai": ^4.3.0
     "@types/chai-subset": ^1.3.3
@@ -21728,7 +21989,7 @@ __metadata:
       optional: true
   bin:
     vitest: vitest.mjs
-  checksum: efde5b654b8098ea5d4d0472f02c74b89d790b101fc4bf6fb9e6e01147ee7e2ccafa461ce6c8c056cfccd9ad383f650f79b5b255ba083de678cb469bac8cff6e
+  checksum: 4048499c3339f5b6f9ba9468f7bfe987f140f6e0553922321a021ee0f8829c7ea75e93780a7328529dfb1c292423def738048e73574621ec6e8efe2c56edb019
   languageName: node
   linkType: hard
 
@@ -21784,8 +22045,8 @@ __metadata:
   linkType: hard
 
 "vue-demi@npm:*":
-  version: 0.12.4
-  resolution: "vue-demi@npm:0.12.4"
+  version: 0.12.5
+  resolution: "vue-demi@npm:0.12.5"
   peerDependencies:
     "@vue/composition-api": ^1.0.0-rc.1
     vue: ^3.0.0-0 || ^2.6.0
@@ -21795,7 +22056,7 @@ __metadata:
   bin:
     vue-demi-fix: bin/vue-demi-fix.js
     vue-demi-switch: bin/vue-demi-switch.js
-  checksum: cd715e008837c67aa7018e96f5556ffd4f26cbeed031116251c3983b777ff163550670af28b2b39bc650c5f7c4738976524e013cfc36aa17e26bc07fad70efc5
+  checksum: 40a0470caea8312e0d4df2541f141c36c768dfc7f2f7d41f0f28ba29df11d3119e2f09b94c815f13b7c7f3f45dbc247b0e9e0c02a1800e2823e241c1d771e39b
   languageName: node
   linkType: hard
 
@@ -22039,15 +22300,15 @@ __metadata:
   linkType: hard
 
 "webcrypto-core@npm:^1.7.2":
-  version: 1.7.2
-  resolution: "webcrypto-core@npm:1.7.2"
+  version: 1.7.3
+  resolution: "webcrypto-core@npm:1.7.3"
   dependencies:
     "@peculiar/asn1-schema": ^2.1.0
     "@peculiar/json-schema": ^1.1.12
     asn1js: ^2.3.2
     pvtsutils: ^1.2.2
     tslib: ^2.3.1
-  checksum: 7adafc3e91086f2be25569f5b4000d4663b79f05581b9da0ebc5c19f2a102d3b97f97809b686b69bea82cf4da55d1d156de25758d2b9690d2b2356828de5482e
+  checksum: 7a2c62a172454fc986693067b2abaaa50034fb15fb1a495e1544dadbedd19e26eac464650e4a8e1f085b165775516352aee5e1bd71cadd1c99e38bb141f1bac1
   languageName: node
   linkType: hard
 
@@ -22206,9 +22467,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"webpack@npm:^5, webpack@npm:^5.38.1, webpack@npm:^5.70.0":
-  version: 5.70.0
-  resolution: "webpack@npm:5.70.0"
+"webpack@npm:^5, webpack@npm:^5.38.1, webpack@npm:^5.71.0":
+  version: 5.71.0
+  resolution: "webpack@npm:5.71.0"
   dependencies:
     "@types/eslint-scope": ^3.7.3
     "@types/estree": ^0.0.51
@@ -22239,7 +22500,7 @@ __metadata:
       optional: true
   bin:
     webpack: bin/webpack.js
-  checksum: 00439884a9cdd5305aed3ce93735635785a15c5464a6d2cfce87e17727a07585de02420913e82aa85ddd2ae7322175d2cfda6ac0878a17f061cb605e6a7db57a
+  checksum: 84b273a15180d45dafe4fc4a3ccccba2f72210f327a1af39713b3ef78148768afb0e18fa0cddaea4af5dd54ace199fbbdfcef9aec8da7e9c248f8b1b7cc413e1
   languageName: node
   linkType: hard