vite-vue3-js

项目初始化

yarn create @vitejs/app

安装 vue-ant-design

yarn add ant-design-vue@next

引入的vue-ant-design

import { createApp } from "vue";
import App from "./App.vue";

// note 引入ant-design-vue
import Antd from "ant-design-vue";
import "ant-design-vue/dist/antd.css";

const app = createApp(App);

// note  使用Ant-design-vue
app.use(Antd);
app.mount("#app");

安装 vue-router@4

yarn add vue-router@4

router.ts

import { createRouter, createWebHashHistory, RouteRecordRaw ,RouterOptions} from 'vue-router';

const routes: RouteRecordRaw[] = [
  {
    path: "/home",
    component: () => import('../views/home/index.vue'),
  },
  {
    path: "/user",
    component: () => import('../views/user/index.vue'),
  }
]
const router = createRouter({
  history: createWebHashHistory(), 
  routes: routes
});

export default router;

安装vuex@next

yarn add vuex@next --save

store.js

import { createStore } from "vuex";
import {state} from './state';

const store = createStore({
  state,
   mutations: {
     changeTitle(state,title) {
        state.title = title;
        document.title = title;
     }
   }
});

export default store;

state.js

export interface State {
  title: string,
}

export const state: State = {
  title: 'demo'
}