grunt-processhtml Defining a variable number of files

Question

I'm using grunt-processhtml to replace a few things before things go to production. The trick is, I have a variable number of files that are spat out by assemble, and I really want to keep my data separate from my gruntfile. It would seem I have to do something to declare each file that needs manipulation:

    processhtml: {
      deploy: {
        options: {
          process: true,
        },
        files: {
          '/one_file.html': ['/one_file.html'],
          '/two_file.html': ['/two_file.html'],
          '/red_file.html': ['/red_file.html'],
          '/blue_file.html': ['/blue_file.html']
        }
      }
    }
    

As you can imagine, that could get quite cumbersome.

I know that with most grunt specific node modules, you can use some globbing techniques, so I tinkered with that.

    processhtml: {
      deploy: {
        options: {
          process: true,
        },
        files: {
          '/**.html': ['/**.html']
        }
      }
    },

But that doesn't seem to work either... Any suggestions?

Edit: Add More Background Information (In case I'm losing the forest for the trees)

The Problems

I have a few major goals for my development environment.

• Viewing pages locally with non-compressed files for debugging (this goes for html, css, and js)
• The ability to work completely offline as I travel, and am often without internet. This can also have the side effect of making page reloads even faster. A few things that I've encountered as problems with this, and why I came to processhtml:
  • Using CDNs to serve up things like jQuery.
  • Google fonts: If I reference a google font, it generates the CSS on the spot, based on my browser... but since I have my fonts that I'm developing with installed locally, I just want to use those, so I need a way of keeping the google fonts inserted.
• I want to be able to compress and concatenate every single asset before deployment.

How I'm Going About It (for better or worse)

So, now I'll tell you about the system I've devised. I have three top level directories in my project where the three different phases live

1. src: this is where all of my assemble files live. Within here, I have tons of hbs files, and partials, thus keeping my markup dry, and my minimal data in YAML (which I love, as I can have coworkers fill it out).

2. dev: once the files are "assembled" they end up in this directory. Here they are uncompressed, and the connect server with livereload is run from here.

3. deploy: At this point, I have a grunt task called 'preflight' which compresses all of my files down, and gets rid of any cruft, leaving a super sleek streamlined folder ready for another rsync task to send it up to production.

Anyway, if you have a different way to accomplish this. I would love to hear it :)

Thanks!

Answer 1

After writing a method to accomplish the task, and then some further checking the manual, I found this:

http://gruntjs.com/configuring-tasks#building-the-files-object-dynamically

My Gruntfile config contains something that looks like this, and it works like a charm:

    processhtml: {
      deploy:{
        options: {
          process: true,
        },
        files: [
          {
          expand: true,     
          cwd: 'deploy/',   
          src: ['**/*.html'],
          dest: 'deploy/',  
          ext: '.html'
        },
        ],
    }

Answer 2

counterbeing's solution works like a charm!

@valerio0999 to exclude a folder use the '!' negation operator on the 'src'

processhtml: {
  deploy:{
    options: {
      process: true,
    },
    files: [
      {
      expand: true,     
      cwd: 'deploy/',   
      src: ['**/*.html', '!**/_includes/**'],
      dest: 'deploy/',  
      ext: '.html'
    },
    ],
}