What does `{,*/}` mean in paths of Gruntfile.js?

Question

In Gruntfile.js, I have got:

watch: {
    styles: {
      files: [
        '<%= yeoman.app %>/styles/{,*/}*.less'
      ],
      tasks: ['copy:styles', 'autoprefixer']
    }
}

For the path, what does {,*/} mean indeed? How does it differ to using double asterisks **/?

Answer 1

This pattern is widely used in yeoman templates: it means to look only one level deep inside folder hierarchy. It is used mostly for performance reasons since watching too many files simultaneously can be slow (or even impossible).

Answer 2

These are globbing patterns for Grunt, supported by the node-glob and minimatch libraries.

Basically:

• * matches any number of characters, but not /
• ** matches any number of characters, including /, as long as it's the only thing in a path part
• {} allows for a comma-separated list of "or" expressions

So, styles/{,*/}*.less matches the following files:

• LESS files inside styles directory
• LESS files inside direct sub-directories of styles directory (but no deeper)

Answer 3

I believe you're using a minimatch pattern there.

The double asterisk is a glob that causes recursion into subdirectories.

The single asterisk only matches 0 or more characters in the current directory (it matches every character except the slash character).

For example, a/**/d will match a/b/c/d.

Answer 4

The answer is globbing-patterns .

The other answers had already answer what does{,*/}* mean.

But the different between **/ and {,*/}* is folder depth.

• /styles/{,*/}*.less has been divided into two situation

  1. /styles/*.less
  2. /styles/*/*.less

For example

/styles/{,*/}*.less will match /styles/x.less (situation 1)

/styles/{,*/}*.less will also match /styles/test/x.less (situation 2)

But /styles/{,*/}*.less can't match /styles/test/test1/x.less

But /styles/**/*.less can do that