Grunt is treating folder with a dot as a file

Question

When trying to compile my grunt file and build into my dist folder for deployment I get the following error in the console:

Running "rev:dist" (rev) task
dist/public/app/app.js >> 63decaf3.app.js
dist/public/app/vendor.js >> a09756ab.vendor.js
dist/public/app/app.css >> d2017fc8.app.css
Warning: Unable to read "dist/public/bower_components/animate.css" file (Error code: EISDIR).

The reason for this is that I have a bower component I've got installed named animate.css. This library is of course installed in my bower_components folder, but the matching string I have in my Grunt file only looks for files with an extension of .js, .css, et cetera. Here's my matching string:

// Renames files for browser caching purposes
rev: {
  dist: {
    files: {
      src: [
        '<%= yeoman.dist %>/public/{,*/}*.js',
        '<%= yeoman.dist %>/public/{,*/}*.css',  // Offending line
        '<%= yeoman.dist %>/public/assets/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
        '<%= yeoman.dist %>/public/assets/fonts/*'
      ]
    }
  }
}

And here's the directory structure:

bower_components
  -> ...
  -> angular-ui-router
  -> animate.css  // Folder with the error
  ---> animate.css  // File that it should be recognizing
  ---> animate.min.css  // File that it should be recognizing
  -> es5-shim
  -> ...

In this case, how would I tell Grunt that this is a directory which contains files rather than a file itself?

Answer 1

I have slightly different approach.

bower install animate-css --save

it will grab animate.css but save at:

bower_components/animate-css

Using this method you don't have to play with Gruntfile.js which I personally consider unpleasant to edit and even look at ;)

Answer 2

Exclude the animate.css folder, then include everything inside it. I am not sure about the exact glob options see here, for details. Something like this:

rev: {
  dist: {
    files: {
      src: [
        '<%= yeoman.dist %>/public/{,*/}*.js',
        '<%= yeoman.dist %>/public/{,*/}*.css',
        '!<%= yeoman.dist %>/public/bower_components/animate.css',
        '<%= yeoman.dist %>/public/bower_components/animate.css/animate.css',
        '<%= yeoman.dist %>/public/assets/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
        '<%= yeoman.dist %>/public/assets/fonts/*'
      ]
    }
  }
}