vite+vue3+element-plus

vite+vue3+element-plus

1.开始

npm create vite@latest app -- --template vuenpm installlnpm run dev

2.引入element-ui

npm install element-plus

修改main.js

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
createApp(App).use(ElementPlus).mount('#app')

3.安装vue-router

npm install vue-router@4

修改main.js

import router from "./router"

不识别@

npm i @types/node -D

修改vue.config.js

import { resolve } from 'path'export default defineConfig {// ...resolve: {alias: {"@": resolve(__dirname, 'src'), // 路径别名},extensions: ['.js', '.json', '.ts'] // 使用路径别名时想要省略的后缀名，可以自己 增减}
}

index.js

import { createRouter, createWebHistory } from "vue-router"
import Index from '@/view/index/index.vue'const router = createRouter({history: createWebHistory(),routes : [{ path: '/', redirect: '/index' },{path: '/',name:'index',component: () => import('../view/index/index.vue'),children:[{path: '/index',name: 'index',component: Index}]}]
})export default router