配置router路由

配置路由:

npm install vue-router@4 --save

创建src/router/index.ts

import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";
 
//  配置路由
const routes: Array<RouteRecordRaw> = [
  {
    path: "/", 
    component: () => import("../views/Home/index.vue"),
  },
 
];
// 返回一个 router 实列,为函数,配置 history 模式
const router = createRouter({
  history: createWebHistory(),
  routes,
});
 
export default router

创建main.ts

import { createApp } from 'vue'
import './style.css'
import ElementPlus from 'element-plus'
import locale from "element-plus/lib/locale/lang/zh-cn";//element-plus中文版
import App from './App.vue'
import router from "./router/index" 
import 'element-plus/theme-chalk/index.css' 	
import { createPinia } from 'pinia'
// 创建pinia实例
const pinia = createPinia()

const app = createApp(App)
app.use(ElementPlus, { size: 'small', zIndex: 3000,locale }) //element-plus中文版,加入locale
app.use(router).use(pinia).mount('#app')

你可能感兴趣的:(vue,vue.js,前端,javascript)