This should be easy. I have this path variable declared in a gulpfile.js:

paths = {
    img: [
    'src/patternlab/**/**/*.jpg',
    'src/patternlab/**/**/*.png'
  ]
};

I'd like to use a simple OR switch for the file extension, along the lines of:

'src/patternlab/**/**/*.(jpg|png)'

But I can't find the right syntax! Have tried numerous permutations, looked through MDN etc…

This should be easy. I have this path variable declared in a gulpfile.js:

paths = {
    img: [
    'src/patternlab/**/**/*.jpg',
    'src/patternlab/**/**/*.png'
  ]
};

I'd like to use a simple OR switch for the file extension, along the lines of:

'src/patternlab/**/**/*.(jpg|png)'

But I can't find the right syntax! Have tried numerous permutations, looked through MDN etc…

• javascript
• regex
• gulp

• what errors are you getting, you already look good to go – aelor Commented May 13, 2014 at 10:23
• no errors but no images output either! – Jake Rayson Commented May 13, 2014 at 10:58

2 Answers 2

The patterns used by gulp are those promoted by npm's glob package which doesn't use a precise regex pattern matching syntax, I imagine because these things start to look horrific when matching against paths.

the documentation regarding minimatch (used by glob) cover your described case:

'/**/*.+(jpg|png|tiff)'

have you tried this :

^src\/patternlab\/.{2}\/.{2}\/.\.(jpg|png)$

the regex you have mentioned will also match files which have file names like some.png something else.

try this in your console:

var newarr = []
var paths = {
    img: [
    'src/patternlab/**/**/*.jpg',
    'src/patternlab/**/**/*.png',
    'src/patternlab/**/**/*.tiff',
    'src/patternlab/**/**/*.jpg'
  ]
};
for(var i=0;i<paths.img.length;i++){
  if (/^src\/patternlab\/.{2}\/.{2}\/.\.(jpg|png)$/.test(paths.img[i])){
    newarr.push(paths.img[i]);
  }
}

console.log(newarr);