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的 ...
随机推荐
- php5.4编译安装--nginx
1.下载源码包 wget 网址/源码包2.解压源码包 tar -zxvf 源码包3.创建一个安装目录 mkdir /usr/local/php4.进入解压后的目录中,初始化安装环境./configur ...
- 阶段2 JavaWeb+黑马旅游网_15-Maven基础_第3节 maven标准目录结构和常用命令_07maven常用命令
以给的hellowordl的的代码为例. src/main/java下,这是主业务逻辑代码 里面的内容只有一个jsp的跳转 测试包下: 里面很简单的就输出了一句话 复制项目的目录 先cd进入复制的这个 ...
- LeetCode All in One 题目讲解汇总(转...)
终于将LeetCode的免费题刷完了,真是漫长的第一遍啊,估计很多题都忘的差不多了,这次开个题目汇总贴,并附上每道题目的解题连接,方便之后查阅吧~ 如果各位看官们,大神们发现了任何错误,或是代码无法通 ...
- Excel公式的常见错误值及其解决方法
Excel公式的常见错误值及其解决方法 经常用Excel的朋友可能都会遇到一些莫名奇妙的错误值信息:# N/A!.#VALUE!.#DIV/O!等等,出现这些错误的原因有很多种,如果公式不能计算正确结 ...
- .NetCore2.0项目之ABP+Vue(IView框架)单页应用之路,启动
首先很久没有好好静下心来做点东西了,一直用忙碌做借口,实际还是懒,今天决定动一动. 第一步,下载自己的项目模板 首先vue项目国内的暂时还没有,要登录https://aspnetboilerplate ...
- 【MM系列】SAP 财务帐与后勤不一致情况
公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[MM系列]SAP 财务帐与后勤不一致情况 ...
- VBA计算器的全部实现
我们将加入 除零逻辑 和 对话框提示. 后面 就很简单了~~~ 提供效果图跟 代码 代码示例 Sub 矩形1_Click() ' ' 矩形1_Click Macro ' 代码编辑 Dim number ...
- elementUI 分页bug解决
在使用elementui的分页组件时,我发现当对表格数据进行删除时,而且是删除到该页最后一条数据时,当前页面currentPage并不能自动减1,也就是说,当前页currentPage只有你点击页码时 ...
- [ARC101E]Ribbons on Tree(容斥,dp)
Description 给定一棵有 \(n\) 个节点的树,满足 \(n\) 为偶数.初始时,每条边都为白色. 现在请你将这些点两两配对成 \(\frac{n}{2}\) 个无序点对.每个点对之间的的 ...
- [Codeforces 1246B] Power Products (STL+分解质因数)
[Codeforces 1246B] Power Products (STL+分解质因数) 题面 给出一个长度为\(n\)的序列\(a_i\)和常数k,求有多少个数对\((i,j)\)满足\(a_i ...