vite+vue3搭建的工程实现批量导入store的module
更新时间：2024年03月04日 14:18:59 作者：♂♀放纸鸢
这篇文章主要介绍了vite+vue3搭建的工程实现批量导入store的module方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
vite+vue3搭建的工程批量导入store的module
src\store文件夹下index.ts
import { createStore } from 'vuex'
const modulesFiles = import.meta.glob('./modules/*.ts', { eager: true })
const modules: any = {}
for (const path in modulesFiles) {
const moduleName = path.replace(/^\.\/modules\/(.*)\.\w+$/, '$1')
modules[moduleName] = (modulesFiles[path] as any).default
}
const store = createStore({
modules
})
export default store问题的关键
是如何引入模块内的文件
const modules = import.meta.glob('./dir/*.js', { eager: true })一开始没加第二个参数，一直都是动态加载，创建完了store模块才被附上值，然后改为这样的写法
const modulesFiles = import.meta.globEager('./modules/*.ts')但是globEager的写法已经废弃，强迫症发作一定要改
如下图：
但是可以点击去查看
官网上也有解释
匹配到的文件默认是懒加载的，通过动态导入实现，并会在构建时分离为独立的 chunk。
如果你倾向于直接引入所有的模块（例如依赖于这些模块中的副作用首先被应用）
你可以传入 { eager: true } 作为第二个参数
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了Vue中的computed和watch的区别详解，文章围绕主题展开详细的内容介绍，具有一定的参考价值，需要的小伙伴可以参考一下2022-09-09
这篇文章主要介绍了vue-pdf插件实现pdf文档预览方式(自动分页预览)，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-03-03
使用强大的Vuetify开发前端页面,结果发现官方没有提供简便的全局消息通知组件,所以自己动手写了一个简单的组件,接下来通过本文给大家介绍使用vuetify实现全局v-alert消息通知的详细代码,感兴趣的朋友跟随小编一起看看吧2024-02-02
vue3 集成 echarts 最大的坑就是出现了,reactive 的数据 刷新了,但图表缺不会刷新,所以本文就给大家详细的介绍一下vue3集成echarts数据刷新后图表不刷新的解决方法,需要的朋友可以参考下2023-08-08
本文介绍了vue 项目常用加载器及配置详解，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-01-01
这篇文章主要介绍了Vue如何实现变量表达式选择器，帮助大家更好的理解和学习使用vue框架，感兴趣的朋友可以了解下2021-02-02
本篇文章主要介绍了解析Vue2 dist 目录下各个文件的区别，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-11-11
这篇文章主要介绍了vue 通过ref调用router-view子组件的方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧2023-11-11
今天来说说权限管理，因为网上已经有很多关于这方面的很多内容，下面这篇文章主要给大家介绍了关于vue权限问题的完美解决方案，需要的朋友们下面来一起学习学习吧2019-05-05
这篇文章主要为大家详细介绍了如何在vue3中使用xgPalyer截图功能,以及自定义插件,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下2024-02-02
最新评论