require.context的作用

news2024/9/24 3:27:12

1、什么是 require.context

一个 webpack 的 api ,通过该函数可以获取一个上下文,从而实现工程自动化(遍历文件夹的文件,从中获取指定文件,自动导入模块)。
在前端工程中,如果一个文件夹中的模块需要频繁引用时可以使用该中方式一次性引入

2、使用

参数类型说明
dirnameString需要读取模块的文件的所在目录
useSubdirectoriesBoolean是否遍历子目录
RegExpRegExp匹配的规则(正则表达式)
//遍历svg目录下的所有svg文件
const req = require.context('./svg', false, /\.svg$/)

3、返回结果

属性类型说明
resolveFunction接受一个参数request,request为文件夹下面匹配文件的相对路径,返回这个匹配文件相对于整个工程的相对路径
keysFunction返回一个数组,由匹配成功的文件所组成的数组
idString执行环境的 id

4、自动加载目录下特定 js 文件,并将模块数据添加进原型链属性中

// api/index.js
const path = require('path');
const moduleList = {};
const dirname = "@/api"
reqContext(dirname);
function reqContext(dir) {
  // 匹配特定 js 文件
  const fileList = require.context(dir , true, /(api).js$/);
  let files = fileList.keys();
  if(!files.length) return ;
  files.forEach( paths => {
    let content = require(`${dir}/${path.join(paths)}`);
    assignment(content);
  });
}
// 将模块的数据加载进 moduleList 对象中
function assignment(obj) {
  if(!Object.keys(obj).length) return ;
  let arr = Object.keys(obj);
  arr.forEach( key => {
    moduleList[key] = obj[key];
  })
}
module.exports = moduleList;
// index.js
import moduleList from '@/api';
import vue from 'vue';

vue.prototype.$moduleList = moduleList;

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1368115.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

以太网交换机——稳定安全,构筑数据之桥

交换机,起源于集线器和网桥等网络通信设备,它在性能和功能上有了很大的发展,因此逐渐成为搭建网络环境的常用的设备。 随着ChatGPT爆发,因为用户量激增而宕机事件频频发生,云计算应用催生超大规模算力需求,…

基于springboot+html的汽车销售管理系统设计与实现

基于springboothtml的汽车销售管理系统 🍅 作者主页 央顺技术团队 🍅 欢迎点赞 👍 收藏 ⭐留言 📝 🍅 文末获取源码联系方式 📝 前言 随着汽车市场的快速发展,汽车销售企业面临着越来越大的管理…

速卖通跨境智星:解决IP及环境问题,实现批量注册轻松搞定

如果想要注册大批量的速卖通买家号,关键问题之一就是IP及浏览环境的管理。为了确保每个账号都能独立运行,使用独立的IP是必不可少的。近期,速卖通跨境智星备受关注,支持绑定代理IP,并内置反指纹技术,为用户…

【新华三】IPsec VPN 实验配置(地址固定)

【新华三】IPsec VPN 实验配置(地址固定) 注意实验需求配置思路配置命令拓扑R1基础配置配置第一阶段 IKE SA配置第二阶段 IPsec SA ISP_R2基础配置 R3基础配置配置第一阶段 IKE SA配置第二阶段 IPsec SA PCPC1PC2 检查建立成功查看命令清除IKE / IPsec S…

kubernetes Namespace Labels 详解

写在前面:如有问题,以你为准, 目前24年应届生,各位大佬轻喷,部分资料与图片来自网络 内容较长,页面右上角目录方便跳转 namespace 实现资源分组,label实现业务分组 Namespace 基础理论 最重…

Java BIO、NIO(通信/群聊系统、零拷贝)、AIO

Java BIO、NIO(通信/群聊系统、零拷贝)、AIO BIO、NIO、AIO特点和场景 BIO(Blocking I/O)、NIO(Non-blocking I/O)、AIO(Asynchronous I/O)是Java中用于处理I/O操作的三种不同的I/O模型,它们具…

【Spring 篇】深入浅出:用Spring注解开发的奇妙之旅

在编程的世界里,Spring框架如同一位慈祥的导师,为我们打开了无尽可能性的大门。而在Spring的广袤领域中,注解是我们最亲密的伙伴之一。本篇博客将深入浅出地介绍使用Spring注解进行开发的奇妙之旅,为你解开注解的神秘面纱。 前奏…

游泳时用什么耳机听歌好? 口碑最好的游泳耳机分享

在游泳的律动中,欣赏动感音乐或沉浸在激励的声音中,无疑是一种愉悦的体验。因此,在选择一款适合游泳的耳机时,不仅需要考虑音质和舒适度,还要兼顾防水性能,确保在水中也能畅快聆听。本文将为您介绍一些备受…

jupyter内核错误

1、在dos窗口输入以下命令激活环境:anaconda activate 【py环境名,比如py37】(目的是新家你一个虚拟环境) 2、在虚拟环境py37下安装jupyter notebook,命令:pip install jupyter notebook 3、安装ipykerne…

强化学习的数学原理学习笔记 - 值函数近似(Value Function Approximation)

文章目录 概览:RL方法分类值函数近似(Value function approximation)Basic idea目标函数(objective function)优化算法(optimization algorithm) Sarsa / Q-learning with function approximati…

Windows中处理PySpark报错:SparkException: Python worker failed to connect back

Windows中处理PySpark报错:SparkException: Python worker failed to connect back 这个问题可能是发送在windows10以上的版本,使用datafram的方法是没问题,但是使用rdd算子出现这个问题,报错SparkException: Python worker fail…

企业常用的几种实用的加速FTP传输方式

FTP作为互联网上最早应用的文件传输协议之一,同时也是企业内外常用的文件和数据交换方式。然而,随着数据量的增加和对传输速度、稳定性、安全性等要求的提高,FTP传输面临一系列挑战,给企业的业务效率和数据安全带来了困扰。本文将…

大数据深度学习长短时记忆网络(LSTM):从理论到PyTorch实战演示

文章目录 大数据深度学习长短时记忆网络(LSTM):从理论到PyTorch实战演示1. LSTM的背景人工神经网络的进化循环神经网络(RNN)的局限性LSTM的提出背景 2. LSTM的基础理论2.1 LSTM的数学原理遗忘门(Forget Gat…

【软考中级-软件设计师】day4:数据结构-线性表、单链表、栈和队列、串

大纲 线性结构 顺序存储和链式存储区别 单链表的插入和删除 真题 栈和队列 真题 串

python匹配问题

脏数据匹配 一般数据建模步骤中,数据清洗耗时占比80%以上,因为现实中接触到的数据相当脏,无法直接简单的用pandas的merge函数解决。下面以QS大学排名的匹配为例,简单介绍脏数据匹配中会遇到的问题和主要步骤。 1 问题描述 给定…

PyQT5实现图像处理应用(含Windows7下完整打包方案)

目录 1、任务概述2、环境安装2.1 创建虚拟环境2.2 安装依赖库 3、程序开发3.1 框架搭建3.2 读取图像3.3 图像处理 4、打包部署5、小结 1、任务概述 本篇博文将通过PyQT5来实现一个简单的图像处理应用,并完成打包部署。 本文开发平台:Windows10 64位系统…

【Vue3】2-6 : 计算属性与侦听器区别与原理(一)

本书目录:点击进入 一、计算属性 - computed:{} 1.1 目的 1.2 写法 代码 二、特征 2.1 调用时当属性调用 2.2 缓存 2.3 默认只读 2.4 可赋值:需要定义成对象,并写get,set方法 (类似于java) 三、原…

《More Effective C++》学习

条款1:仔细区别 pointers 和 references 引用应该被初始化,指针可以不被初始化。不存在指向空值的引用这个事实意味着使用引用的代码效率比使用指针的要高。因为在使用引用之前不需要测试它的合法性。指针与引用的另一个重要的不同是指针可以被重新赋值…

IDC MarketScape 低/无代码厂商评估:得帆信息被评为领导者

《IDC MarketScape:中国低代码/无代码开发平台2023年厂商评估 》报告正式发布。报告从战略与能力两大方向,在产品和功能、客户交付服务能力、营销和销售能力、伙伴与生态、商业战略模式等多个维度对国内低/无代码厂商进行全面评估。 得帆信息凭借战略与能力双项领先…

电子电器架构网络演化 —— 车载以太网TSN

电子电器架构网络演化 —— 车载以太网TSN 我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 屏蔽力是信息过载时代一个人的特殊竞争力,任何消…