资讯专栏INFORMATION COLUMN

关于 Glob (gulp)的学习

ThreeWords / 3114人阅读

摘要:参考资料下文是关于的方法的第一个参数的学习。因此,会展开为和。获取目录下所有文件名长度为字符的文件。匹配该路径段中在指定范围内的一个字符。匹配完全且精确地匹配,且不可组合不符合任何模型之一的字符。可通过在设置,让将视为普通字符。

参考资料:https://github.com/isaacs/nod...

下文是关于 Gulp 的 gulp.src(globs[, options]) 方法的第一个参数 globs 的学习。

需要注意的是:
当该参数 globs 为数组时,其包含的多个 glob 会按顺序进行解析,这意味着以下意图是可以实现的:

// 排除所有以字母 b 开头的 js 文件,但不排除 bad.js
gulp.src(["*.js", "!b*.js", "bad.js"])
Glob

使用 shell 里的 patterns 匹配文件,如 * 等。

用法 用 npm 安装 glob
npm i glob

编写js代码:

var glob = require("glob");

// options 是可选参数
glob("**/*.js", options, function (er, files) {
  // files 参数是一个文件名数组。
  // 若参数 options 的 `nonull` 属性为 true,则在匹配不到文件时, files 参数则为 ["**/*.js"]。
  //( 若 `nonull` 为 false 时, files 为空数组)。
  // er 是一个 error 对象或 null。
})
Glob 初级

"Globs" 是你通过在命令行输入字符后完成某些操作时的 pattern。如 ls *.js,或将 build/* 放在 .gitignore

在解析路径段的 patterns 前,braced sections 会展开为一个集合。braced sections 以 { 开头,} 为结尾,中间部分以英文逗号 , 分隔。braced sections 可以含有斜杠符号 /。因此,a{/b/c,bcd} 会展开为 a/b/cabcd

以下字符用在路径段时,会拥有特别的含义:

* : 匹配0或多个字符。

   glob("js/*.js", function(err, files){
       console.log(files);
   });

获取js目录下的所有js文件(不包括以.开头的文件,下文有方法解决:对 glob 方法的 options 参数的属性 dot:true)。

? : 匹配一个字符(不能为空)。

   glob("js/a?.js", function(err, files){
       console.log(files);
   }

获取js目录下所有文件名长度为2字符的js文件。例如:能匹配 js/ab.js,不能匹配 js/a.js。

[...] : 匹配该路径段中在指定范围内的一个字符。

注意:不能组合,只能匹配其中一个字符。另外,如果指定范围的首字符是 !^,则匹配不在指定范围内一个字符。

    glob("js/a[0-3].js", function(err, files){
        console.log(files);
    })

获取js目录下以a开头,第二个字符为0-3之间(包括0和3)的js文件。若改为 ["js/[^ab].js"],则匹配 js/c.js,不匹配 js/cd.js、js/ac.js。

!(pattern|pattern|pattern) : 匹配(完全且精确地匹配,且不可组合)不符合任何模型之一的字符。注意 | 前后不能有空格,下同。

   glob("js/!(a|b).js", function(err, files){
       console.log(files);
   });

匹配 js 目录下的 aa.js、ab.js、ba.js、c.js 不匹配 a.js、b.js。

?(pattern|pattern|pattern):匹配多个 pattern 中 0 或 1 个(精确匹配,不可以组合)。

   glob("js/?(a|b).js", function(err, files){
       console.log(files);
   });

匹配 js 目录下的 a.js、b.js,不匹配 ab.js

+(pattern|pattern|pattern) : 至少匹配多个 pattern 中的一个。与*(pattern|pattern|pattern) 不用的是,它必须1个及以上,不能为空。

   glob("js/+(a|b)b.js", function(err, files){
        console.log(files);
   });

匹配 js 目录下的 ab.js、bb.js、ababab.js,不能匹配 abcd.js(也就是说:只允许匹配出现在范围内的字符) ,也不能像 js/*(a|b)b.js 那样匹配 b.js。

*(a|b|c) : 匹配括号中多个 pattern 中0或任意多个(pattern可相互组合)。

   glob("js/*(a|b|c).js", function(err, files){
       console.log(files);
   });

匹配 js 目录下的 a.js、ab.js、abc.js、ba.js,不匹配 abcd.js(也就是说:只允许匹配出现在范围内的字符)。

@(pattern|pattern|pattern) 匹配多个 pattern 中的任意一个(即不可以组合,且不能为空或大于1个)。与 ?(pattern|pattern|pattern) 区别是不可为空。

   glob("js/@(a|b)b.js", function(err, files){
       console.log(files);
   });

匹配 js 目录下的 ab.js、bb.js,不匹配 b.js、abb.js、abc.js。

*** 类似,可以匹配任何内容(可匹配空),但 ** 不仅能匹配路径中的特定一段,还能匹配后代所有目录(即多段路径段)。

   glob("js/**/*.js", function(err, files){
       console.log(files);
   });

匹配 js 目录下所有js文件,如 js/a.js 或 js/a/b/c/d.js。

Dots(即 .)

如果文件或目录的某路径段以 . 作为首字符,那么该路径段不会符合任何 glob pattern,除非该 pattern 的相应路径段同样以 . 作为首字符。

例如,pattern a/.*/c 会匹配文件 a/.b/c,而 pattern a/*/c 则不会匹配该文件,因为 * 不会匹配以 . 字符开头的文件。

可通过在 options 设置 dot: true,让 glob 将 . 视为普通字符。

Basename 匹配

如果在 options 设置 matchBase: true,且 pattern 不含有 /,那么将会寻找任何匹配 basename 的文件,即在当前路径下的文件树进行搜索。例如,*.js 会匹配 test/simple.basic.js

空集

如果不匹配任何文件,则会返回空数组。这点与 shell 不同,shell 会返回自身 pattern。

$echo echo a*s*d*f
a*s*d*f

若想得到 bash 那样的行为,可对 options 参数设置 nonull:true

若发现文中有任何错误,或有任何好的建议,欢迎评论。

GitHub:关于 Glob (gulp) 的学习

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/78748.html

相关文章

  • WebPack在多页应用项目中探索

    摘要:在项目配置中的探索持续更新中后台配置一项目需求请认真看目录结构项目构建很大都基于目录来的线上用户访问的目录线上资源文件目录前端开发目录一个业务需求模块每个业务需求模块下会有很多页面 WebPack在项目配置中的探索(持续更新中) webpack + gulp + vue (thinkPHP后台配置) 一、项目需求(请认真看目录结构,项目构建很大都基于目录来的) --- Applicat...

    Caicloud 评论0 收藏0
  • gulp构建一个简单常用环境

    摘要:简单做点通俗的讲解。如果你想要创建一个序列化的队列,并以特定的顺序执行,嗯,戳文档文档。自然是表示任意,全部。到这里,其实就是一个小规模的调试环境,接下来,让我们升级一下,开始构造简单的发布环境压缩采用的是插件。做一个的就好,只需要。 gulp作为一个自动化构建工具,在前端开发中大大的提高了开发效率,前端开发者们可以利用他减少许多繁复无脑的操作。这里简单构建一个小环境,就可以在以后的学...

    Shimmer 评论0 收藏0
  • Gulp使用入门

    摘要:是一款流式构建系统,如果说是基于任务执行器,就是基于的文件流任务执行器,比起有如下特点使用方便通过代码优于配置的策略,可以让简单的任务简单,复杂的任务更可管理。 作者:Jogis原文链接:https://github.com/yesvods/Blog/issues/1转载请注明原文链接以及作者信息 showImg(http://itanguo.cn/wp-content/uploads...

    ShevaKuilin 评论0 收藏0
  • 重读 Gulp

    摘要:当接收一个回调函数的时候,一定要注意回调函数中的参数。主要作用就是用来读取文件或者文件夹中的数据。表示文件的名称指的是发生的变化使用技巧的进一步使用,可以参照中文官网中的技巧集。 Gulp 简介 Gulp 对现在的前端而言,是一个稍微老旧的工具了,但是,为了复习以前学过的内容,还是把它翻出来,放在自己的博客中。说不定哪天又用到了呢。 需要说明的是,这里使用的 Gulp 版本是 3.9....

    vpants 评论0 收藏0
  • “流式”前端构建工具——gulp.js 简介

    摘要:流式构建改变了底层的流程控制,大大提高了构建工作的效率和性能,给用户的直观感觉就是更快。我的看法关于流式构建,短短几句话无法讲清它的来龙去脉,但是在的世界里,确实是至关重要的。 Grunt 一直是前端领域构建工具(任务运行器或许更准确一些,因为前端构建只是此类工具的一部分用途)的王者,然而它也不是毫无缺陷的,近期风头正劲的 gulp.js 隐隐有取而代之的态势。那么,究竟是什么使得 g...

    ShevaKuilin 评论0 收藏0

发表评论

0条评论

ThreeWords

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<