帮忙列出一个典型创建配置vue-route案例代码一个典型创建配置pinia案例的代码。

典型创建配置vue-route案例代码：

// main.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from './components/Home.vue'
import About from './components/About.vue'

Vue.use(VueRouter)

const routes = [
  { path: '/', component: Home },
  { path: '/about', component: About }
]

const router = new VueRouter({
  routes
})

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

典型创建配置pinia案例的代码：

// main.js

import Vue from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'

const pinia = createPinia()

new Vue({
  pinia,
  render: h => h(App)
}).$mount('#app')

// store.js

import { defineStore } from 'pinia'

export const useCounterStore = defineStore('counter', {
  state: () => ({
    count: 0
  }),
  actions: {
    increment() {
      this.count++
    }
  }
})

<!-- Counter.vue -->

<template>
  <div>
    <p>Count: {{ counter.count }}</p>
    <button @click="counter.increment()">Increment</button>
  </div>
</template>

<script>
import { defineComponent } from 'vue'
import { useCounterStore } from './store'

export default defineComponent({
  setup() {
    const counter = useCounterStore()

    return {
      counter
    }
  }
})
</script>
``