redux中reducer使用require.context使用技巧

先使用create-react-app搭建项目

使用webpack的require.context可以获取文件的上下文，然后将reducers文件夹下的reducer根据文件名存到一个数组里，这样一个文件对应一个reducer。在根据action来找reducer时就不要switch case了。

在使用typescript中require.context报错：

类型“NodeRequire”上不存在属性“context”

解决方法：

npm install @types/webpack-env -D
或者：
yarn add @types/webpack-env --save-dev

require.context获取文件的上下文，参考：
require.context介绍

const context = require.context('./',false,/\.ts$/)
context.keys()//返回当前目录下的以ts为后缀的文件名称数组

//下面是返回当前目录下的ts后缀文件的文件名和其内export default组成的对象
context.keys().map(context).reduce((total,item,index)=>{
    const path = context.keys()[index]
    const re = new RegExp('(\S+\/)(\S+)\.ts')
	const name = (re.exec(path) || [])[2];
	if (name !== 'index') {
        total[name] = item.default;
      }
      return total;
},{})

这个可以用在reducers上，可以减少switch case。只需要把action的名称写成文件名。