diff --git a/docs/components/Hero.vue b/docs/components/Hero.vue
index ab0eeca..61e6058 100644
--- a/docs/components/Hero.vue
+++ b/docs/components/Hero.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import Button from '~/components/Button.vue'
 import TimelineSvg from '~/components/TimelineSvg.vue'
-import VueSelect from 'vue-select'
+import VueSelect from '~/components/VueSelect.vue'
 </script>
 
 <template>
@@ -84,7 +84,7 @@ import VueSelect from 'vue-select'
               ></div>
               <div class="pl-4 pt-4">
                 <div class="mt-6 flex items-start px-1 text-sm">
-                  <vue-select :options="['hello']" />
+                  <VueSelect :options="['hello']" />
                 </div>
               </div>
             </div>
diff --git a/docs/components/VueSelect.vue b/docs/components/VueSelect.vue
new file mode 100644
index 0000000..5edd315
--- /dev/null
+++ b/docs/components/VueSelect.vue
@@ -0,0 +1,7 @@
+<script setup>
+import VueSelect from '../../src/index.js'
+</script>
+
+<template>
+  <VueSelect v-bind="$attrs" />
+</template>
diff --git a/docs/components/content/VueSelect.vue b/docs/components/content/VueSelect.vue
new file mode 100644
index 0000000..4b9d7bf
--- /dev/null
+++ b/docs/components/content/VueSelect.vue
@@ -0,0 +1,7 @@
+<script setup>
+import VueSelect from '~/components/VueSelect.vue'
+</script>
+
+<template>
+  <VueSelect v-bind="$attrs" />
+</template>
diff --git a/docs/content/guide/values.md b/docs/content/guide/values.md
index 33f1694..79d40b6 100644
--- a/docs/content/guide/values.md
+++ b/docs/content/guide/values.md
@@ -1,9 +1,3 @@
-<script setup>
-import vSelect from 'vue-select';
-import ReducerNestedValue from '@/components/ReducerNestedValue.vue';
-import ReducedWithNoMatchingOption from '@/components/ReducedWithNoMatchingOption.vue';
-</script>
-
 ## Getting and Setting
 
 ### `v-model`
@@ -75,7 +69,10 @@ is true, `v-model` and `value` must be an array.
 <v-select multiple v-model="selected" :options="['Canada','United States']" />
 ```
 
-<v-select multiple :options="['Canada','United States']" />
+::vue-select{options=['Canada','United States'],multiple=true}
+
+::
+
 
 ## Transforming Selections
 
@@ -151,7 +148,7 @@ To allow input that's not present within the options, set the `taggable` prop to
 <v-select taggable multiple />
 ```
 
-<v-select taggable multiple />
+<vue-select taggable multiple />
 
 If you want added tags to be pushed to the options array, set `push-tags` to true.
 
@@ -159,7 +156,7 @@ If you want added tags to be pushed to the options array, set `push-tags` to tru
 <v-select taggable multiple push-tags />
 ```
 
-<v-select taggable multiple push-tags />
+<vue-select taggable multiple push-tags />
 
 ### Using `taggable` & `reduce` together
 
diff --git a/docs/nuxt.config.ts b/docs/nuxt.config.ts
index bc6d176..5a9f4c5 100644
--- a/docs/nuxt.config.ts
+++ b/docs/nuxt.config.ts
@@ -1,3 +1,4 @@
+import { resolve } from 'path'
 // https://v3.nuxtjs.org/api/configuration/nuxt.config
 export default defineNuxtConfig({
   css: ['~/assets/styles/fonts.css'],
@@ -35,6 +36,15 @@ export default defineNuxtConfig({
     },
   },
 
+  vite: {
+    resolve: {
+      alias: {
+        // resolve the aliases used in the vue-select build
+        '@': resolve(__dirname, '../src'),
+      },
+    },
+  },
+
   build: {
     // @see https://github.com/tailwindlabs/headlessui/discussions/1545#discussioncomment-2871517
     transpile: ['@headlessui/vue'],