创建vite项目

yarn create @vitejs/app

   输入项目名称后，在选择vue，在选择ts

添加路由

yarn add vue-router@4.0

添加router/index.ts

import { createRouter, createWebHashHistory } from 'vue-router'
//在vue-router新版本中，需要使用createRouter来创建路由
export default createRouter({
     // 指定路由的模式，此处使用的时hash模式
     history: createWebHashHistory(),
     // 路由地址
     routes: []
})

安装vuex

yarn add vuex@4.0

新建store/index.ts

import { createStore } from 'vuex'
interface State{
     userName: string
}
export default createStore({
     state: {
          userName: 'Rowrey'
     }
})

main.ts全局引用

import router from './router/index'
import vuex from './store/index'
const app = createApp(App)
app.use(router)
app.use(vuex)
app.mount("#app")

引用sass

yarn add sass sass-loader -D

运行

yarn dev