webpack中require.context 用法
1.require.context(directory, useSubdirectories = false, regExp = /^\.\//)
Examples:
require.context("./test", false, /\.test\.js$/);
require.context("../", true, /\.stories\.js$/);
2.入参
1. 你要引入文件的目录
2.是否要查找该目录下的子级目录
3.匹配要引入的文件
3.返回的:
1. context.require 返回一个require 函数:
function webpackContext(req) {return __webpack_require__(webpackContextResolve(req));
函数有三个属性:resolve 、keys、id
· resolve: 是一个函数,他返回的是被解析模块的id
· keys: 也是一个函数,他返回的是一个数组,该数组是由所有可能被上下文模块解析的请求对象组成
· id:上下文模块的id
用法:
const pages = require.context('pages', true, /\/.*\.js$/)
pages.keys().map(key => {
  if (!key.includes('/store/')) return
  const keys = key.replace(/(\.\/|\.js)/g, '')
  modules[keys.split('/').pop()] = pages(key).default
})
export default modules
最后把modules注册进去即可
webpack中require.context 用法的更多相关文章
- 一张图带你了解webpack的require.context
		很多人应该像我一样,对于webpack的require.context都是一知半解吧.网上很多关于require.context的使用案例,但是我没找到可以帮助我理解这个知识点的,于是也决定自己来探索 ... 
- [转]webpack中require和import的区别
		webpack中可以写commonjs格式的require同步语法,可以写AMD格式的require回调语法,还有一个require.ensure,以及webpack自己定义的require.incl ... 
- webpack中require和import的区别
		commonjs同步语法 经典的commonjs同步语法如下: var a = require('./a'); a.show(); 此时webpack会将a.js打包进引用它的文件中.这是最普遍的情形 ... 
- dva webpack 利用require.context加载多个model
		dva redux数据管理都在models,根据业务不同models可能会有几十甚至上百的 [模块.js], 每次在index.js使用 app.model(require('./models/exa ... 
- webpack的require.context()实现路由“去中心化”管理
		最近在开发一个大型vue单页面应用的时候,项目最初是将所有的路由写在一个router.js的文件里. const router = new Router({ mode: "history&q ... 
- js中require()的用法----JS如何连接数据库执行sql语句或者建立数据库连接池
		var vue = require('vue'); 引入vue的意思,commonjs的写法.node都是用require来载入模块的,可以看看webpack+vue. require()可以调用模块 ... 
- 关于webpack require.context() 的那点事
		先说 webpack里面有这么一招:使用require.context()方法来自动导入模块 官方文档有点深奥,老衲百度下拿了一段来直接使用,但是想看下它是如何运行的 本篇这里不会有太深入的研究,只是 ... 
- webpack中,require的五种用法
		a.js: module.exports = function(x){ console.log(x); } 一,commonjs同步: var b = require('./a');b('你好')// ... 
- webpack中output配置项中chunkFilename属性的用法
		chunkFilename和webpack.optimize.CommonsChunkPlugin插件的作用差不多,都是用来将公共模块提取出来,但是用法不一样,这里主要介绍chunkFilename的 ... 
随机推荐
- 红帽虚拟化RHEV-安装RHEV-M
			目录 目录 前言 软件环境 时间同步 更新系统 安装并配置RHEV-M 添加域并为用户授权远程登陆 安装rhevm报告 安装Spice协议 最后 前言 在红帽虚拟化RHEV-架构简介篇中介绍了RHEV ... 
- 终于, Delphi XE2 携带 GDI+ 库了
			终于, Delphi XE2 携带 GDI+ 库了 使用了较早的 http://www.progdigy.com uses Winapi.GDIPAPI, Winapi.GDIPOBJ{, Winap ... 
- 【工具安装】kali linux 安装教程
			日期:2019-07-14 16:36:21 介绍:使用最新版的 VMware 来安装 kali linux 0x01.下载镜像 首先需要安装 VMware,安装步骤点这里. VMware 安装教程 ... 
- Selenium学习之==>WebDriver驱动对照表
			转自www.imdsx.cn 1.Chrome 对于chrome浏览器,有时候会有闪退的情况,也许是版本冲突的问题,我们要对照着这个表来对照查看是不是webdriver和chrome版本不对. chr ... 
- 2018.03.29 python-pandas transform/apply 的使用
			#一般化的groupby方法:apply df = pd.DataFrame({'data1':np.random.rand(5), 'data2':np.random.rand(5), 'key1' ... 
- C# sqlite 无法识别的datetime格式 FromOADate
			再读取不可控数据库datetime字段时,遇到了一个奇葩问题——“无法识别的datetime格式” 搞了半天…… 数据库里看:2017-06-06 10:28:30.000 不做处理查询报错:“无法识 ... 
- Matlab——系统预定义的变量 常用数学函数
- 【SQL系列】深入浅出数据仓库中SQL性能优化之Hive篇
			公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[SQL系列]深入浅出数据仓库中SQL性能优化之 ... 
- springBoot(2) HelloWorld
			首先 下载一个 Spring Boot环境. 下载地址:https://spring.io/tools3/sts/all 打开STS.exe 一,新建项目 然后在空白处新建: 1.New→Other→ ... 
- 25. Reverse Nodes in k-Group[H]k个一组翻转链表
			题目 Given a linked list, reverse the nodes of a linked list k at a time and return its modified list. ... 
