How to use configure Grunt to copy bower font files?

Question

I'm using bower to install bootstrap and font-awesome packages, and use Grunt as a build solution. I have wiredep configured to properly update my index.html file. Everything works great. The only problem I have is copying the font files to the dist/ directory.

I realize that I can configure my grunt copy:dist target, but given that each package may use a different directory structure to store their fonts, it is challenging to have a single rule to copy the fonts. Additionally, if these packages have the fonts listed in their bower.json files, isn't there a way to detect these fonts and copy them automatically?

Is there another Grunt plugin that I can use that recognizes the font files the same way wiredep recognizes the css/js files?

I've seen other posts on SO that relate to the same issue, but no official solution to the problem.

Answer 1

I realize this question is a bit old, but I use a plugin called grunt-bowercopy (https://www.npmjs.com/package/grunt-bowercopy) to do most of my copying from bower packages. It may require a bit of manual configuration though, so it might not live up to your requirements.

Your bowercopy config could look something like this:

bowercopy: {
    // Global bowercopy options
    options: {
        runBower: true
    },
    // Move fonts from bower packages into font folder
    fonts: {
        options: { destPrefix: '/dist/fonts' },
        files: {
            '': 'fontawesome/fonts/*'
        }
    }
}

You could tweak the glob-pattern to simply move all font files in the bower_components directory, into some destination folder. That's a decent option if you don't like to manually add the path, for every bower package that includes fonts. I like the "manual labor" though.