vite 配置vuex modules

目录结构

index.js

import { createStore } from 'vuex'
// 导入文件
const files = import.meta.globEager('./modules/*.js')
console.log('files:',files)
const modules = {}
for (const key in files) {
    const file = files[key].default;
    if(file != undefined){
        console.log('file:',file)
        // 截取文件名
        modules[key.replace(/(\.\/modules\/)|(\.js)/g, '')] = file
    }
}
console.log('modules:',modules)
export default createStore({
    modules,
})

const files = import.meta.globEager('./modules/*.js') 获取/modules/文件下的文件，打印数据如下。

modules[key.replace(/(\.\/modules\/)|(\.js)/g, '')] = file 进行截取文件名。把“./modules/account.js”截取成“account”

定义

export default {
  namespaced: true,
  state: {
    // 系统信息
    info: {}
  }
}

使用

import {computed} from 'vue'
import {useStore} from 'vuex'
export default {
    setup(prop,context){
      const store = useStore()
      const info = computed( () => store.state.system.info)
      return{
        info
      }
    }
}