今天在工作看老大写的项目的代码过程中看见了一段代码用到了glob这个模块,于是来记录一下他的基本用法。
1-glob介绍
1.1-npm官网:https://www.npmjs.com/package/glob
1.2-说明:node的glob模块允许你使用 *等符号, 来写一个glob规则,像在shell里一样,获取匹配对应规则的文件.,这个glob工具基于javascript.它使用了 minimatch 库来进行匹配。总的来说有了它我们可以利用它匹配出我们想要的目录下的一些文件,在一些大型项目中做一些配置的时候应该还是蛮有用的,比如我们在配置webpack的入口文件的时候当入口文件过多时。
2-使用步骤
2.1-下载包:
代码语言:shell复制npm i glob
2.2-在用到的文件中引入:
代码语言:javascript复制var glob =require("glob")
2.3-路径中的某一段可以使用下面的这些字符表示,他们各自都有各自的作用:
1. *
: 匹配该路径段中0个或多个任意字符:
//获取js目录下的所有js文件.(不包括以'.'开头的文件)
glob("js/*.js",function (er, files) {
console.log(files)
})
2. ?
: 匹配该路径段中1个任意字符:
//获取js目录下所有名字只有1个字的js.
glob("js/?.js",function (er, files) {
console.log(files)
})
3. [...]
: 匹配该路径段中在指定范围内字符:
//获取js目录下a开头,第二个字符为0-3之间(包括0和3)的js(a03.js不能被匹配到) 注意不能组合,只能是其中一个字符
glob("js/a[0-3].js",function (er, files) {
console.log(files)
})
4. *(pattern|pattern|pattern)
: 匹配括号中多个模型的0个或多个或任意个的组合,注意|前后不能有空格
//获取js目录下a.js,a1.js,b.js,或者a,a1,b这几个字符的组合的js,比如ab.js
glob("js/*(a|a1|b).js",function (er, files) {
console.log(files)
})
更多匹配符就不一一记录了,具体可以参照文章:https://www.cnblogs.com/liulangmao/p/4552339.html
3-利用glob来快速配置webpack的入口文件
前面讲到的都是异步的方法,传入一个回调,当获取到匹配的文件的时候执行回调.如果需要同步的获取文件列表,我们再来学习一个glob的api:var files = glob.sync(pattern, [options])
这个项目是egg-react-ssr 服务端渲染框架,可以看到我们的几个页面如下,那么我们需要给对应页面配置webpack多个入口
具体步骤:
接下来我们可以打印一下入口对象entry:
现在我们就直接将我们的entry对象传入到webpack配置中就好啦~