vue3 typescript的一些配置

		import {createRouter, createWebHashHistory, RouteRecordRaw} from 'vue-router'
		import {App} from "vue";
		
		
		function importAllRouter(){
		    let routes: Array<RouteRecordRaw> = []
		    const routerContext = require.context('./', true, /\.ts$/)
		    routerContext.keys().forEach(route => {
		        if (route.startsWith('./index')) return
		        const routerModule = routerContext(route)
		        routes = routes.concat(routerModule.default || routerModule)
		    })
		    return routes
		}
		
		
		const router = createRouter({
		    history: createWebHashHistory(),
		    routes:importAllRouter()
		})
		
		export function setupRouter(app: App<Element>){
		    app.use(router)
		}
	
	
	
	
	import {createStore} from 'vuex'
	import { Module ,ModuleTree} from 'vuex';
	import {App} from "vue";
	
	export interface StoreModuleType<S> extends Module<S, S> {
	  namespaced: true;
	  name: string;
	}
	function importAllStore<S> (): ModuleTree<S> {
	  const modules:ModuleTree<S>  = {}
	  const storeContext = require.context('./modules', true, /\.ts$/)
	  storeContext.keys().forEach((store) => {
	    const routerModule = storeContext(store)
	    const name = routerModule.default.name
	    modules[name] = routerModule.default
	  })
	  return modules;
	}
	const store =  createStore({
	  modules:importAllStore()
	})
	
	
	export function setupStore(app: App<Element>){
	  app.use(store)
	}


import {StoreModuleType} from "@/store/index.ts";
import {loginMenu} from "@/views/login/service"
import {Mutation, Action} from 'vuex';
import {setStorage} from "@/common/utils/localToken";
import type {menuType} from "@/views/frame/components/menuLeft/data"


export interface StateType {
    userInfo: string,
    menuJson: menuType[],
}

export interface ModuleType extends StoreModuleType<StateType> {
    state: StateType;
    mutations: {
        mutationsMenu: Mutation<StateType>,
        mutationsLogin: Mutation<StateType>,
    };
    actions: {
        actionMenu: Action<StateType, StateType>,
    };
}


const initState: StateType = {
    userInfo: "",
    menuJson: [],
}


const StoreModel: ModuleType = {
    namespaced: true,
    name: 'login',
    state: {
        ...initState
    },

    mutations: {
        async mutationsLogin(state, payload) {
            await setStorage("token", payload.token)
            await setStorage("userInfo", JSON.stringify(payload))
            state.userInfo = payload
        },
        mutationsMenu(state, payload) {
            state.menuJson = payload
        },
    },
    actions: {
        async actionMenu({commit}) {
            try {
                const data = await loginMenu()
                if (data && data.code === 1) {
                    commit('mutationsMenu', data.data.permissions)
                    return true
                }
            } catch (error) {
                return false
            }
        }
    },
}
export default StoreModel




import {createApp} from 'vue'
import App from './App.vue'

import {setupPlugins} from "@/plugins/index.ts"
import {setupStore} from "@/store/index.ts"
import {setupRouter} from "@/router/index.ts"
import {setupComponents} from "@/components/index.ts"

async  function ProRunApp(){
    const app = createApp(App)
    /**
     * 加载通用组件
     * */
    setupComponents(app)
    /**
     * 加载路由
     * */
    setupRouter(app)
    /**
     * 加载vuex
     * */
    setupStore(app)
    /**
     * 加载通用插件
     * */
    setupPlugins(app)
    /**
     * 挂载dom
     * */
    app.mount('#app')
}

ProRunApp()