require.context 自动引入指定目录下的文件、组件、reducer
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的更多相关文章
- python_自动查找指定目录下的文件或目录的方法
代码如下 import os def find_file(search_path, file_type="file", filename=None, file_startswith ...
- PHP 获取指定目录下所有文件(包含子目录)
PHP 获取指定目录下所有文件(包含子目录) //glob — 寻找与模式匹配的文件路径 $filter_dir = array('CVS', 'templates_c', 'log', 'img', ...
- iOS案例:读取指定目录下的文件列表
// // main.m // 读取指定目录下的文件列表 // // Created by Apple on 15/11/24. // Copyright © 2015年 Apple. All rig ...
- PHP 批量获取指定目录下的文件列表(递归,穿透所有子目录)
//调用 $dir = '/Users/xxx/www'; $exceptFolders = array('view','test'); $exceptFiles = array('BaseContr ...
- socket实现两台FTP服务器指定目录下的文件转移(不依赖第三方jar包)
通过socket实现两台FTP服务器指定目录下的文件转移,其中包含了基础了ftp文件列表显示.上传和下载.这里仅供学习用,需掌握的点有socket.ftp命令.文件流读取转换等 完整代码如下: Ftp ...
- 文件名命工具类(将指定目录下的文件的type类型的文件,进行重命名,命名后的文件将去掉type)
import java.io.File; /** * <b>function:</b> 文件命名工具类 * @author hoojo * @createDate 2012-5 ...
- linux --> 删除指定目录下所有文件
删除指定目录下所有文件 代码样例: ///////////////////////////////////////////////////// //Name: DeleteFile //Purpose ...
- C# 获取指定目录下所有文件信息
/// <summary> /// 返回指定目录下所有文件信息 /// </summary> /// <param name="strDirectory&quo ...
- python实现指定目录下批量文件的单词计数:并发版本
在 文章 <python实现指定目录下批量文件的单词计数:串行版本>中, 总体思路是: A. 一次性获取指定目录下的所有符合条件的文件 -> B. 一次性获取所有文件的所有文件行 - ...
- [转]C# 获取指定目录下所有文件信息、移动目录、拷贝目录
原文:http://blog.csdn.net/vchao13/article/details/6200255 1.获取指定目录下所有文件信息 /// <summary> /// 返回指定 ...
随机推荐
- 基于python的数学建模---高阶样条插值
为了满足对函数光滑性的需要,我们可以使用一种有弹性的长条(称之为样条),强迫它弯曲通过样本点. import numpy as npimport matplotlib.pylab as plfrom ...
- 【DL论文精读笔记】AlexNet
1.1引言 1.2数据集 就是ImageNet,当时计算机视觉最大的数据集 1.3结构 采用双GPU结构实现,并行处理图像,2-3,5-全连接部分中间还将特征图共享 最后全连接层输出的4096的语义信 ...
- thinkphp6的主要特性
采用PHP7强类型(严格模式) 支持更多的PSR规范 多应用支持 ORM组件独立 改进的中间件机制 更强大和易用的查询 全新的事件系统 支持容器invoke回调 模板引擎组件独立 内部功能中间件化 S ...
- mingw编译opencv动态链接库和静态链接库及使用方法
前言 我一直不知道编译的过程以及cmake, make 这些工具是干什么的,所有抽时间研究了一下. 简单来说就是 cmake 是根据 CMakeLists.txt 用来生成 makefile文件的.而 ...
- Flink SQL管理平台flink-streaming-platform-web安装搭建
文章都在个人博客网站:https://www.ikeguang.com/ 同步,欢迎访问. 最近看到有人在用flink sql的页面管理平台,大致看了下,尝试安装使用,比原生的flink sql界面确 ...
- async.js 版本兼容问题 async.filter举例
async3.x 和async2.6.1 版本下 const files = ['dir1/file1.txt','dir2/file3.txt','dir3/file6.txt']; // Usin ...
- SourceGenerator 使用姿势(1):生成代理类,实现简单的AOP
SourceGenerator 已经出来很久了,也一直在关注.之前观摩大佬 xljiulang 的 WebApiClient 使用 SourceGenerator 生成接口代理类,深受启发,准备拿过来 ...
- 二阶段目标检测网络-Faster RCNN 详解
Faster RCNN 网络概述 Conv layers RPN 网络 Anchors 生成 RPN 网络训练集 positive/negative 二分类 RPN 生成 RoIs(Proposal ...
- Burp Suite安装
1.Burpsuite简介 Burp Suite是一款集成化的渗透测试工具,包含了很多功能,可以帮助我们高效地完成对Web应用程序的渗透测试和攻击. Burp Suite 由Java语言编写,基于J ...
- 发送http2请求
有时服务器会检测http协议版本,有http/1.1和h2,requests发送的是http1.1的请求 # pip install httpx client = httpx.Client(http2 ...