4 files changed, 19 insertions, 1 deletions
diff --git a/examples/framework-vue/.vscode/extensions.json b/examples/framework-vue/.vscode/extensions.json
new file mode 100644
index 000000000..22a15055d
--- /dev/null
+++ b/examples/framework-vue/.vscode/extensions.json
@@ -0,0 +1,4 @@
+{
+  "recommendations": ["astro-build.astro-vscode"],
+  "unwantedRecommendations": []
+}
diff --git a/examples/framework-vue/.vscode/launch.json b/examples/framework-vue/.vscode/launch.json
new file mode 100644
index 000000000..d64220976
--- /dev/null
+++ b/examples/framework-vue/.vscode/launch.json
@@ -0,0 +1,11 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "command": "./node_modules/.bin/astro dev",
+      "name": "Development server",
+      "request": "launch",
+      "type": "node-terminal"
+    }
+  ]
+}
diff --git a/examples/framework-vue/src/components/Counter.vue b/examples/framework-vue/src/components/Counter.vue
index d5d5215f7..5ce5352b8 100644
--- a/examples/framework-vue/src/components/Counter.vue
+++ b/examples/framework-vue/src/components/Counter.vue
@@ -9,7 +9,7 @@
 	</div>
 </template>
 
-<script>
+<script lang="ts">
 import { ref } from 'vue';
 export default {
 	setup() {
@@ -34,6 +34,7 @@ export default {
 	margin-top: 2em;
 	place-items: center;
 }
+
 .counter-message {
 	text-align: center;
 }
diff --git a/examples/framework-vue/tsconfig.json b/examples/framework-vue/tsconfig.json
index 4db6ee701..7e64c543c 100644
--- a/examples/framework-vue/tsconfig.json
+++ b/examples/framework-vue/tsconfig.json
@@ -3,6 +3,8 @@
     // Enable top-level await, and other modern ESM features.
     "target": "ESNext",
     "module": "ESNext",
+    // Needed for TypeScript intellisense in the template inside Vue files
+    "jsx": "preserve",
     // Enable node-style module resolution, for things like npm package imports.
     "moduleResolution": "node",
     // Enable JSON imports.