How to change bower-installer path for one component

Question

I am using bower-installer to copy files I need from bower_components folder into bower_dist folder. Here is relevant part of bower.json file:

"install": {
    "path": "bower_dist"
},
"dependencies": {
    "jquery": "~2.1.4",
    "bootstrap": "~3.3.4",
    "slick.js": "~1.5.5"
},

Now this is creating bower_dist folder and within it folder for each component. The problem is that within slick.js component I have few files (eot, svg, ttf, woff) that I need to have in /slick.js/fonts folder (rather than just /slick.js/ folder).

How do I do this? I've tried specifying special case for eot, svg, ttf and woff, but then that gets applied to all components. Plus I don't want to introduce need to specify all file types (js, css, etc)... rather want to just configure special font type for slick.js. Is this possible to do?

Dumfound

Answer 1

This proved to be tougher than I thought:

"install": {
    "path": "bower_dist",
    "sources": {
        "slick-carousel": {
            "mapping": [
                { "bower_components/slick-carousel/slick/slick.min.js": "slick.min.js" },
                { "bower_components/slick-carousel/slick/slick.css": "slick.css" },
                { "bower_components/slick-carousel/slick/slick-theme.css": "slick-theme.css" },
                { "bower_components/slick-carousel/slick/ajax-loader.gif": "ajax-loader.gif" },
                { "bower_components/slick-carousel/slick/fonts/slick.eot": "fonts/slick.eot" },
                { "bower_components/slick-carousel/slick/fonts/slick.svg": "fonts/slick.svg" },
                { "bower_components/slick-carousel/slick/fonts/slick.ttf": "fonts/slick.ttf" },
                { "bower_components/slick-carousel/slick/fonts/slick.woff": "fonts/slick.woff" }
            ]
        }
    }
},

I've upgraded to new version of slick.js and now it's called slick-carousel in bower - just to explain difference in package name.

Dumfound

Answer 2

The problem here appears to be that slick.js uses a glob pattern in their bower.json main file array which is not supported...

Globs like js/*.js are not allowed.

You should do the following...

1. Override the required files for slick.js in your bower.json file (see Install multiple main files and Configurable paths)

   "install": {
       "base": "bower_dist",
       "path": {
           "js": "{name}",
           "css": "{name}",
           "eot": "{name}/fonts",
           "svg": "{name}/fonts",
           "ttf": "{name}/fonts",
           "woff": "{name}/fonts"
       },
       "sources": {
           "slick.js": [
               "bower_components/slick.js/slick/slick.min.js",
               "bower_components/slick.js/slick/slick.css",
               "bower_components/slick.js/slick/slick-theme.css",
               "bower_components/slick.js/slick/fonts/slick.eot",
               "bower_components/slick.js/slick/fonts/slick.svg",
               "bower_components/slick.js/slick/fonts/slick.ttf",
               "bower_components/slick.js/slick/fonts/slick.woff"
           ]
       }
   }
   

   Substitute bower_components for whatever your bower install directory is.

2. Follow this pull request.

Strophic

As soon as I add "sources": { "slick.js": ... command bower-installer stops publishing slick.js. Are you sure that's proper format? I've also tried modifying bower.json from slick.js the way you did it in pull request but still it doesn't work - it doesn't create proper folder structure. – Dumfound

@kape123 I was just following the bower-installer documentation ~ github.com/blittle/bower-installer#install-multiple-main-files. Looks like you need to prefix the file path with your bower install directory. I'll update my answer with an example – Strophic

yeah when I put it like that, it copies files. But it again puts them all in the same directory - /bower_dist/slick.js/ ... it doesn't create fonts directory for fonts. ;( – Dumfound

@kape123 then I'd guess you need to use the configurable paths – Strophic

Those would mess up all components, which is not something I wanted as I explained in the question. I am granting you bounty since you helped, but I am adding correct answer on my own. Thanks for your help! – Dumfound

@kape123 glad you got it sorted. I wasn't sure if the file-type path mapping would work for you but it was worth a shot. Last resort would have been the individual file mapping which it seems is what you needed. – Strophic