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 用法的更多相关文章

  1. 一张图带你了解webpack的require.context

    很多人应该像我一样,对于webpack的require.context都是一知半解吧.网上很多关于require.context的使用案例,但是我没找到可以帮助我理解这个知识点的,于是也决定自己来探索 ...

  2. [转]webpack中require和import的区别

    webpack中可以写commonjs格式的require同步语法,可以写AMD格式的require回调语法,还有一个require.ensure,以及webpack自己定义的require.incl ...

  3. webpack中require和import的区别

    commonjs同步语法 经典的commonjs同步语法如下: var a = require('./a'); a.show(); 此时webpack会将a.js打包进引用它的文件中.这是最普遍的情形 ...

  4. dva webpack 利用require.context加载多个model

    dva redux数据管理都在models,根据业务不同models可能会有几十甚至上百的 [模块.js], 每次在index.js使用 app.model(require('./models/exa ...

  5. webpack的require.context()实现路由“去中心化”管理

    最近在开发一个大型vue单页面应用的时候,项目最初是将所有的路由写在一个router.js的文件里. const router = new Router({ mode: "history&q ...

  6. js中require()的用法----JS如何连接数据库执行sql语句或者建立数据库连接池

    var vue = require('vue'); 引入vue的意思,commonjs的写法.node都是用require来载入模块的,可以看看webpack+vue. require()可以调用模块 ...

  7. 关于webpack require.context() 的那点事

    先说 webpack里面有这么一招:使用require.context()方法来自动导入模块 官方文档有点深奥,老衲百度下拿了一段来直接使用,但是想看下它是如何运行的 本篇这里不会有太深入的研究,只是 ...

  8. webpack中,require的五种用法

    a.js: module.exports = function(x){ console.log(x); } 一,commonjs同步: var b = require('./a');b('你好')// ...

  9. webpack中output配置项中chunkFilename属性的用法

    chunkFilename和webpack.optimize.CommonsChunkPlugin插件的作用差不多,都是用来将公共模块提取出来,但是用法不一样,这里主要介绍chunkFilename的 ...

随机推荐

  1. Linux_Rsync远程同步备份服务器

    目录 目录 Remote Sync 同步的类型 本地模式 远程模式 RSync列表模式 RSync 服务模式 Setup RSync service How to use the rsync comm ...

  2. Nil Channels Always Block(Go语言中空管道总是阻塞)

    译自:https://www.godesignpatterns.com/2014/05/nil-channels-always-block.html 原作者:Alex Lockwood 在本篇文章中, ...

  3. react-native start error Invalid regular expression:

    详细错误: error Invalid regular expression: /(.*\\__fixtures__\\.*|node_modules[\\\]react[\\\]dist[\\\]. ...

  4. itchat监听微信撤回消息

    import itchat from itchat.content import * import re msg_infomation = {} # 监听发送消息 @itchat.msg_regist ...

  5. https=http+ssl

    TLS/SSL中使用了非对称加密,对称加密以及HASH算法.握手过程的具体描述如下: 浏览器将自己支持的一套加密规则发送给网站. 网站从中选出一组加密算法与HASH算法,并将自己的身份信息以证书的形式 ...

  6. windows10下安装pygame并验证成功

    首先要确保网络正常 py -m pip install --upgrade pip python -m pip install pygame --user 然后进行验证: py -m pygame.e ...

  7. SpringBoot中定时任务默认是串行执行 如何设置并行

    SpringBoot项目中,定时任务默认是串行执行的,不论启动多少任务,都是一个执行完成,再执行下一个. 如何设置并行呢? @EnableAsync  和@Async 这两个注解来实现 ,具体如下: ...

  8. 【监控笔记】【2.3】扩展事件——慢查询SQL(执行超过3S的SQL)

    --sql server 2008及以上才支持,2012及以上才支持GUI界面 msdn 扩展事件:点击打开链接 [1]T-SQL实现 基于 rpc_completed(远程过程调用已完成时发生) 事 ...

  9. 转:mysql datetime类型精确到毫秒、微秒的问题

    原文地址:mysql datetime类型精确到毫秒.微秒的问题 mysql里面的datetime类型的精确度是可以到1/ 10 ^ 6 秒的某些客户端(如navicat for mysql)的显示经 ...

  10. 使用Docker部署Spring-Boot+Vue博客系统

    在今年年初的时候,完成了自己的个Fame博客系统的实现,当时也做了一篇博文Spring-boot+Vue = Fame 写blog的一次小结作为记录和介绍.从完成实现到现在,也断断续续的根据实际的使用 ...