diff --git a/docs/frameworks/vue2.md b/docs/frameworks/vue-2.md
similarity index 95%
rename from docs/frameworks/vue2.md
rename to docs/frameworks/vue-2.md
index 8c3313c3b..8bd729ab3 100644
--- a/docs/frameworks/vue2.md
+++ b/docs/frameworks/vue-2.md
@@ -1,8 +1,8 @@
-# Vue 2
+# Vue (version 2)
Vue [plays nice](https://custom-elements-everywhere.com/#vue) with custom elements, so you can use Shoelace in your Vue apps with ease.
-?> These instructions are for Vue 2. If you're using Vue 3 or above, please see [Vue instructions](/frameworks/vue).
+!> These instructions are for Vue 2. If you're using Vue 3 or above, please see the [Vue 3 instructions](/frameworks/vue).
## Installation
diff --git a/docs/frameworks/vue.md b/docs/frameworks/vue.md
index 333e51f51..d31c46723 100644
--- a/docs/frameworks/vue.md
+++ b/docs/frameworks/vue.md
@@ -2,7 +2,7 @@
Vue [plays nice](https://custom-elements-everywhere.com/#vue) with custom elements, so you can use Shoelace in your Vue apps with ease.
-?> These instructions are for Vue 3 and above. If you're using Vue 2, see [Vue 2 instructions](/frameworks/vue2).
+?> These instructions are for Vue 3 and above. If you're using Vue 2, please see the [Vue 2 instructions](/frameworks/vue-2).
## Installation
@@ -28,10 +28,10 @@ setBasePath('https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@%VERSION%/dis
You'll need to tell Vue to ignore Shoelace components. This is pretty easy because they all start with `sl-`.
```js
-import { fileURLToPath, URL } from 'url'
+import { fileURLToPath, URL } from 'url';
-import { defineConfig } from 'vite'
-import vue from '@vitejs/plugin-vue'
+import { defineConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
// https://vitejs.dev/config/
export default defineConfig({
@@ -49,7 +49,7 @@ export default defineConfig({
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
-})
+});
```
Now you can start using Shoelace components in your app!
@@ -70,11 +70,11 @@ Now you can start using Shoelace components in your app!