dva webpack 利用require.context加载多个model
dva redux数据管理都在models,根据业务不同models可能会有几十甚至上百的 【模块.js】,
每次在index.js使用 app.model(require('./models/example').default); 引入 Model 可能要写多个,
那么如何优雅的扩展model,不去重复的require model呢,利用 require.context就可以做到。
require.context是什么
你可以使用该require.context()函数创建自己的上下文。
它允许您传入一个目录进行搜索,一个标志指示是否应该搜索子目录,还有一个正则表达式来匹配文件。
webpack require.context()在构建时解析代码
语法如下:
require.context(directory, useSubdirectories = false, regExp = /^\.\//);
directory 目录,如当前目录下的test: './test' useSubdirectories是否使用子目录, regExp 正则匹配test文件夹下的文件 如匹配js文件 /\.js$/
如下 取出当前目录下的js文件,并过滤掉index.js文件,再用map遍历文件名,context返回default方法:
const context = require.context('./', false, /\.js$/);
export default context
.keys()
.filter(item => item !== './index.js')
.map(key => context(key));
index.js文件引用models:
require('./models').default.forEach(key => {
app.model(key.default);
});
其他使用是一样的,只是不用一个个去require模块了。
dva webpack 利用require.context加载多个model的更多相关文章
- 微信小程序(五) 利用模板动态加载数据
利用模板动态加载数据,其实是对上一节静态数据替换成动态数据:
- react开发中如何使用require.ensure加载es6风格的组件
其实用的babel,在浏览器端就应该可以加载,之前少了个default: require.ensure([],(require) => { let A = require('./a.js').d ...
- .Net Core利用反射动态加载类库的方法(解决类库不包含Nuget依赖包的问题)
在.Net Framework时代,生成类库只需将类库项目编译好,然后拷贝到其他项目,即可引用或动态加载,相对来说,比较简单.但到了.Net Core时代,动态加载第三方类库,则稍微麻烦一些. 一.类 ...
- C# 利用反射动态加载dll
笔者遇到的一个问题,dll文件在客户端可以加载成功,在web端引用程序报错.解决方法:利用反射动态加载dll 头部引用加: using System.Reflection; 主要代码: Assembl ...
- interface21 - web - ContextLoaderListener(Spring Web Application Context加载流程)
前言 最近打算花点时间好好看看spring的源码,然而现在Spring的源码经过迭代的版本太多了,比较庞大,看起来比较累,所以准备从最初的版本(interface21)开始入手,仅用于学习,理解其设计 ...
- webpack教程——css的加载
首先要安装css的loader npm install css-loader style-loader --save-dev 然后在webpack.config.js中配置如下代码 意思是先用css- ...
- java反射并不是什么高深技术,面向对象语言都有这个功能,而且功能也很简单,就是利用jvm动态加载时生成的class对象
java反射并不是什么高深技术,面向对象语言都有这个功能. 面向对象语言都有这个功能,而且功能也很简单,就是利用jvm动态加载时生成的class对象,去获取类相关的信息 2.利用java反射可以调用类 ...
- 一张图带你了解webpack的require.context
很多人应该像我一样,对于webpack的require.context都是一知半解吧.网上很多关于require.context的使用案例,但是我没找到可以帮助我理解这个知识点的,于是也决定自己来探索 ...
- require.js 加载 js 文件 404 处理(配置无效)
main.js 是 配置文件,data-main 是异步加载,如果在main.js未加载完成的时候,使用了require去加载文件,就会导致配置无效 main.js
随机推荐
- Linux学习总结(一) windos环境vmware安装centos7
一.在这里我先简单介绍下虚拟化技术[即在一台电脑上虚拟出子系统,而且可能需要多台服务器进行工作,一般都是linux系统做服务器或者学习研究之用], 二来我们可以有效利用一台pc的资源模拟出终端远程访问 ...
- CopyOnWriteArrayList介绍
CopyOnWrite容器即写时复制的容器.通俗的理解是当我们往一个容器添加元素的时候,不直接往当前容器添加,而是先将当前容器进行Copy,复制出一个新的容器,然后新的容器里添加元素,添加完元素之后, ...
- 智能指针 与 oc中的指针
智能指针 与 oc中的指针 智能指针的原理及实现 当类中有指针成员时,一般有两种方式来管理指针成员:一是采用值型的方式管理,每个类对象都保留一份指针指向的对象的拷贝:另一种更优雅的方式是使用智能指针 ...
- 我想写一个前端开发工具(三):优化!从vue-cli学了几招
我从过年开始写自己的前端工具 coodev,目前已经写出一个基本的架子,大多数预想的功能都能跑通,还剩一些需要解决的问题也都已经列出来了.本来这一周打算解决对不同后端模板的前后端渲染支持的问题.但是看 ...
- 课时46.label标签(掌握)
我们点击QQ注册页面,发现了一个问题,当我们点击密码两个字的时候,输入框聚焦了,而点击确认密码的时候,输入框也聚焦了,而我们上节课做的页面,这么点击,并不聚焦 1.默认情况下文字和输入框是没有关联关系 ...
- Paxos一致性算法(三)
一.概述: Google Chubby的作者说过这个世界只有一种一致性算法,那就Paxos算法,其他的都是残次品. 二.Paxos算法: 一种基于消息传递的高度容错性的一致性算法. Paxos:少数服 ...
- Rem实现自适应布局
rem布局的目的是为了让我们可以用同一份代码,适应不同的移动终端(rem:就是css单位) 1.项目入口html文件<meta name="viewport" content ...
- 在java程序中使用JDBC连接mysql数据库
在java程序中我们时常会用到数据库中的数据或操作数据库中的数据,如果java程序没有和我们得数据库连接,就不能实现在java程序中直接操作数据库.使用jdbc就能将java程序和数据库连起来,此时我 ...
- html5中audio支持音频格式
HTML5 Audio标签能够支持wav, mp3, ogg, acc, webm等格式,但有个很重要的音乐文件格式midi(扩展名mid)却在各大浏览器中都没有内置的支持.不是所有的浏览器都支持MP ...
- JS中的Symbol数据类型
最初JS的6种数据类型: null,undefined,boolean,number,string,object 注意:实际上,array和function都是属于object的子类 ES6中,新增了 ...