require.context api及参数介绍

require.context(dir, useSubdir, regExp)
参数dir：用于动静加载的目录
参数useSubDir：是否对dir指定的子目录进行主动导入， type=boolean
参数regExp：匹配文件的正则表达式，能够在文件中退出特定的字符，依照特定的字符去加载对应的文件

eg: require.context( '.', false, /-route.js$/ )
主动加载以后文件中以-route.js结尾的文件，对子目录不加载

require.context 函数执行后返回一个函数，并且这个函数有三个属性

  • keys 这个属性是一个函数，返回匹配胜利模块的名称组成的数据，数组中的每一项就是每个文件的门路（绝对于dir这个参数指定的相对路径）
  • resolve 这个属性也是一个函数，它接管一个keys()执行之后数组项的参数，返回该参数对应文件绝对于整个我的项目的相对路径（绝对于我的项目根目录的相对路径）
  • id 执行环境的id

require.context函数执行后返回的函数接管一个参数

参数模式为keys函数执行后的数组项，接管参数执行后就拿到了对应文件中的内容

残缺示例：

// 主动导入的两个文件示例// 文件一import { lazy } from 'react';const ComOne = lazy(() => import('../views/day3/ComOne'));  const publicRoutes = [    {        path: '/comone',        component: ComOne,        exact: true    } ];export default publicRoutes;// 文件二import { lazy } from 'react';const ComTwo = lazy(() => import('../views/day3/ComTwo')); const publicRoutes = [    {        path: '/comtwo',        component: ComTwo,        exact: true    }];export default publicRoutes;// 主动导入文件const files = require.context( '.', false, /-route.js$/ ); let routes = [];files.keys().forEach((item)=>{     // 这里的default根据文件一和文件二中的导出形式而定     const _routes = files(item).default;     // 上面的为业务代码，依据本人的需要而定    if(Array.isArray(_routes) && _routes.length){        routes = routes.concat(_routes);      }})export default routes;