feat: 新增路由|状态管理依赖

src/App.vue

@@ -1,10 +1,12 @@
 <script setup>
 import { onMounted } from 'vue'
 import HelloWorld from './components/HelloWorld.vue'
+import { useMainStore } from './store'
 
-onMounted(async () => {
-  let res = await window.myApi.handleSend('liaoruiruirurirui')
-  console.log(res)
+const store = useMainStore()
+
+onMounted(() => {
+  console.log('Vue应用已挂载，路由和Pinia已集成')
 })
 </script>
 
@@ -18,6 +20,16 @@ onMounted(async () => {
     </a>
   </div>
   <HelloWorld msg="Vite + Vue" />
+  
+  <!-- Pinia 状态管理示例 -->
+  <div style="margin: 20px; padding: 20px; border: 1px solid #ccc;">
+    <h3>计数器: {{ store.count }}</h3>
+    <button @click="store.increment()">+1</button>
+    <button @click="store.decrement()">-1</button>
+  </div>
+  
+  <!-- 路由视图 -->
+  <router-view />
 </template>
 
 <style scoped>

src/main.js

@@ -1,5 +1,10 @@
-import { createApp } from 'vue'
-import './style.css'
-import App from './App.vue'
+import { createApp } from "vue";
+import "./style.css";
+import App from "./App.vue";
+import router from "./router";
+import pinia from "./store";
 
-createApp(App).mount('#app')
+const app = createApp(App);
+app.use(router);
+app.use(pinia);
+app.mount("#app");

src/router/index.js

@@ -0,0 +1,16 @@
+import { createRouter, createWebHistory } from 'vue-router'
+
+const routes = [
+  {
+    path: '/',
+    name: 'Home',
+    component: () => import('../App.vue')
+  }
+]
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes
+})
+
+export default router

src/store/index.js

@@ -0,0 +1,23 @@
+import { createPinia } from 'pinia'
+import { defineStore } from 'pinia'
+
+// 创建pinia实例
+const pinia = createPinia()
+
+// 定义一个基本的store
+export const useMainStore = defineStore('main', {
+  state: () => ({
+    count: 0
+  }),
+  
+  actions: {
+    increment() {
+      this.count++
+    },
+    decrement() {
+      this.count--
+    }
+  }
+})
+
+export default pinia