使用vite创建vue3项目router+配置vuex+配置pinia+element-plus---vant

m0_73523460

已于 2024-08-28 15:19:42 修改

阅读量216

点赞数 10

文章标签： javascript vue.js 开发语言

于 2024-08-27 10:25:48 首次发布

本文链接：https://blog.csdn.net/m0_73523460/article/details/141596122

版权

创建vue3项目

1.在项目文件目录下执行cmd到命令行窗口

2.执行 npm init vite@latest

3.根据提示进行选择，首先是确认创建，然后填写文件名，再选择框架，最后选择用js还是ts

配置路由

npm install vue-router@4

import { createRouter, createWebHistory } from 'vue-router'
 
const routes = [
    {
        //路由初始指向
        path: '/',
        name: 'HelloWorld',
        component: () => import('../components/HelloWorld.vue'),
    }
]
 
const router = createRouter({
    history: createWebHistory(),
    routes
})
 
export default router

配置路由vuex

npm install vuex@next --save

import { createStore } from 'vuex'
 
const store = createStore({
  state: {
   
  },
  mutations: {
  },
  actions: {
   
  },
  getters: {

  }
})
 
export default store

配置main.js

import { createApp } from 'vue'
import App from './App.vue'
import './style.css'
import router from './router'
import store from './store'
 
const app = createApp(App)
 
app.use(router)
app.use(store)
app.mount('#app')