1、 语法:let  webpacks = require.context (directory,useSubdirectories,regExp) 

  (directory:"文件路径",useSubdirectories:"布尔值",regExp:"正则表达式")

  // 返回值 是webpack实例 

2、require.context实例有两个方法: let list=webpacks .keys()   // 获取到每一个暴露的内容,数组结构         webpack('路径').default   // 获取到路径中导出的模块

3、作用:自动获取文件中的暴露内容

4、案例:自动注册全局组件,用户在 指定文件 ,只要创建一个.vue 然后创建成一个全局组件

//自动的方法
// require.context('文件路径','布尔值','正则') //语法:require.context('文件路径','布尔值','正则') //这个实例有两个api  1、keys() =>文件路径 =》数组结构 2、webpack(文件路径).default 这个文件内容
// function getArrs(){
let arrs = []
let webpacks= require.context('./',true,/\.vue/)
console.log(webpacks.keys()); webpacks.keys().forEach((item,index)=>{
// ./BackTop.vue
arrs.push({name:item.replace('./','').replace('.vue',''),com:webpacks(item).default})
}) return arrs } function obj(App){
console.log(66666,App); //1 自动获取到 arrs 结构 let comList = getArrs() console.log(comList); comList.forEach((item)=>{
App.component(item.name,item.com)
}) } export default obj

5、案例2:在react脚手架中合并所有的redecer,并自动添加引入

//  合拼reducer
import {combineReducers} from 'redux' // combineReducers
import CartReducer from './CartReducer'
import meReducer from './meReducer'
//这里的引入各自的reducer 引入
//处理方法=》自动引入reducer,自动合拼reducer //1 在reducers文件夹下创建一个 redcuer 文件=》再 合拼成reducer // 1webpack =》require.context =》自动获取到文件中的暴露内容 // 语法:require.context('文件路径',布尔值,正则)
// require.context('文件路径',布尔值,正则) => 返回值是 webpack 实例方式 // 两个方法 1 webf.keys() => ['文件路径','文件路径']
// 2 获取到它的内容 webpack(路径).default
let webf = require.context('./',true,/\.js/)
let list = webf.keys()
//删除 index.js
let index = list.findIndex((item,index)=>{
return item=='./index.js'; // 找出自身文件,把它排除出去
}) list.splice(index,1)
console.log(list);
// 问题 =》合并成一个对象
let objs = {}
list.forEach((item,index)=>{ //文件路径 ./ CartReducer .js
console.log(webf(item).default);
//处理属性 = item //CartReducer .js =>CartReducer
let items = item.replace('./','').replace('.js','')
objs[items ] =webf(item).default // // 获取到路径中导出的模块
})
console.log( objs); //作用:合拼reducer
//语法: let reducers = combineReducers({属性:各自的reducer,属性:各自的reducer}) let reducers = combineReducers( objs) export default reducers

require.context 自动引入指定目录下的文件、组件、reducer的更多相关文章

  1. python_自动查找指定目录下的文件或目录的方法

    代码如下 import os def find_file(search_path, file_type="file", filename=None, file_startswith ...

  2. PHP 获取指定目录下所有文件(包含子目录)

    PHP 获取指定目录下所有文件(包含子目录) //glob — 寻找与模式匹配的文件路径 $filter_dir = array('CVS', 'templates_c', 'log', 'img', ...

  3. iOS案例:读取指定目录下的文件列表

    // // main.m // 读取指定目录下的文件列表 // // Created by Apple on 15/11/24. // Copyright © 2015年 Apple. All rig ...

  4. PHP 批量获取指定目录下的文件列表(递归,穿透所有子目录)

    //调用 $dir = '/Users/xxx/www'; $exceptFolders = array('view','test'); $exceptFiles = array('BaseContr ...

  5. socket实现两台FTP服务器指定目录下的文件转移(不依赖第三方jar包)

    通过socket实现两台FTP服务器指定目录下的文件转移,其中包含了基础了ftp文件列表显示.上传和下载.这里仅供学习用,需掌握的点有socket.ftp命令.文件流读取转换等 完整代码如下: Ftp ...

  6. 文件名命工具类(将指定目录下的文件的type类型的文件,进行重命名,命名后的文件将去掉type)

    import java.io.File; /** * <b>function:</b> 文件命名工具类 * @author hoojo * @createDate 2012-5 ...

  7. linux --> 删除指定目录下所有文件

    删除指定目录下所有文件 代码样例: ///////////////////////////////////////////////////// //Name: DeleteFile //Purpose ...

  8. C# 获取指定目录下所有文件信息

    /// <summary> /// 返回指定目录下所有文件信息 /// </summary> /// <param name="strDirectory&quo ...

  9. python实现指定目录下批量文件的单词计数:并发版本

    在 文章 <python实现指定目录下批量文件的单词计数:串行版本>中, 总体思路是: A. 一次性获取指定目录下的所有符合条件的文件 -> B. 一次性获取所有文件的所有文件行 - ...

  10. [转]C# 获取指定目录下所有文件信息、移动目录、拷贝目录

    原文:http://blog.csdn.net/vchao13/article/details/6200255 1.获取指定目录下所有文件信息 /// <summary> /// 返回指定 ...

随机推荐

  1. Day27:异常详解

    异常 1.1 异常概述 异常(Exception)指程序运行中出现的不正常情况:文件找不到.网络异常.非法参数等等. 我们通过代码来了解一下: public class Demo{ public st ...

  2. Qt_CLion

    目录 安装Qt和CLion 配置 CLion配置Qt的资源文件系统 在项目根文件夹下创建一个资源文件夹 在项目根目录下创建一个qrc文件 安装Qt和CLion 相关的安装网上有很多教程,安装步骤这里不 ...

  3. 2.9:数据交换-csv、Excel、json、爬虫、Tushare获取数据

    〇.任务 1. 使用Python基础文件读写函数完成CSV文件的处理: 2. 使用标准CSV库完成CSV文件的处理: 3. 使用Excel库完成Excel文件的处理: 4. Python数据结构和Js ...

  4. 【SQL真题】SQL2:平均播放进度大于60%的视频类别

    题目:https://www.nowcoder.com/practice/c60242566ad94bc29959de0cdc6d95ef?tpId=268&tqId=2285039& ...

  5. Introduction & Directory

    一个日常划水的高中生而已啦,我不会承认这个博客的CSS是copy的 一个貌似并不准确的图-- <算法竞赛进阶指南>学习: 动态规划: DP经典例题--LIS&LCS 洛谷题解: 搜 ...

  6. Apache HttpClient 5 笔记: SSL, Proxy 和 Multipart Upload

    Apache HttpClient 5 最近要在非SpringBoot环境调用OpenFeign接口, 需要用到httpclient, 注意到现在 HttpClient 版本已经到 5.2.1 了. ...

  7. ubunut安装qtcreater

    安装gcc 1 kxb@kxb:~$ gcc -v 2 3 Command 'gcc' not found, but can be installed with: 4 5 sudo apt insta ...

  8. 数据结构与算法 -> 大顶堆与小顶堆

    一.大顶堆 大顶堆是一种数据结构,它是一颗完全二叉树,并且满足以下性质: 每个节点的值都大于或等于它的子节点的值 因此,大顶堆的根节点(也称为堆顶)总是最大的元素 二.小顶堆 小顶堆也是一种数据结构, ...

  9. BBS项目功能编写逻辑思路汇总

    BBS项目功能编写逻辑思路汇总 一.BBS创数据表 二.BBS注册功能 三.BBS登录功能 四.BBS首页搭建 五.BBS修改密码 六.BBS个人站点 七.BBS文章详情 八.BBS导入模块 九.BB ...

  10. order by 语句怎么优化?

    说明 当前演示的数据库版本5.7 一.一个简单使用示例 先创建一张订单表 CREATE TABLE `order_info` ( `id` int NOT NULL AUTO_INCREMENT CO ...