初始化

src/App.vue

@@ -0,0 +1,38 @@
+<script setup>
+import HelloWorld from './components/HelloWorld.vue'
+</script>
+
+<template>
+  <div class="bg-gray-100 min-h-screen">
+    <header class="bg-gradient-to-r from-blue-500 to-indigo-600 text-white py-4 px-6 flex items-center justify-between">
+      <div class="flex items-center space-x-4">
+        <!-- Logo -->
+        <img src="https://via.placeholder.com/40" alt="Logo" class="h-8 w-8 rounded-full">
+        <span class="font-bold">My App</span>
+      </div>
+
+      <!-- Menu -->
+      <nav class="hidden md:flex space-x-4">
+        <a href="#" class="hover:text-gray-300">Home</a>
+        <a href="#" class="hover:text-gray-300">About</a>
+        <a href="#" class="hover:text-gray-300">Services</a>
+        <a href="#" class="hover:text-gray-300">Contact</a>
+      </nav>
+
+      <!-- User Profile -->
+      <div class="flex items-center space-x-4">
+        <button class="text-sm bg-gray-800 hover:bg-gray-700 text-white font-bold py-2 px-4 rounded">
+          Personal Center
+        </button>
+        <img src="https://via.placeholder.com/40" alt="User Avatar" class="h-8 w-8 rounded-full cursor-pointer">
+      </div>
+    </header>
+
+    <main class="p-6">
+      <slot></slot>
+    </main>
+  </div>
+</template>
+
+<style scoped>
+</style>