grunt bower-install of a shimmed bower dependency

Question

I've bower installed some Git repo that I need for my application and I did it by doing the following:

bower install git://github.com/user/cooltool.git --save
grunt bower-install

and then I get the following error:

cooltool was not injected in your file.
Please go take a look in "app/bower_components/cooltool" for the file you need, then manually include it in your file.

are Bower components that are installed straight from a GitHub repo always required to be manually added to my index.html file? if not, how do I make it include the script correctly?

The Grunt tasks are all part of the yo angular-fullstack scaffolding tool.

The gruntfile's bower-install task is the following:

// Automatically inject Bower components into the app
'bower-install': {
  app: {
    html: '<%= yeoman.app %>/views/index.html',
    ignorePath: '<%= yeoman.app %>/',
    exclude: ['bootstrap-sass']
  }
},

Ultimately, I want the script tag for that cooltool bower component to be injected into my index.html in the Bower build:js section:

<!-- build:js(app) scripts/vendor.js -->
<!-- bower:js -->

    <script ...>

<!-- endbower -->
<!-- endbuild -->

After performing running bower install git://github.com/user/cooltool.git --save, there was a Bower directory created for it, and inside of that directory is a (hidden) .bower.json file, but not a main bower.json file:

.bower.json:

{
  "name": "d3-cloud",
  "homepage": "https://github.com/jasondavies/d3-cloud",
  "version": "1.0.5",
  "_release": "1.0.5",
  "_resolution": {
    "type": "version",
    "tag": "v1.0.5",
    "commit": "83eb4128335eacdc0736ab7a6cafbdc2b124f484"
  },
  "_source": "https://github.com/jasondavies/d3-cloud.git",
  "_target": "~1.0.5",
  "_originalSource": "https://github.com/jasondavies/d3-cloud.git"
}

Jiggerypokery

Can you show the code/config for the bower-install task in your Gruntfile? – Normandnormandy

updated. its weird, i'm not sure how bower-install is responsible for injecting the script tags into build:js / vendor / bower tags – Jiggerypokery

What's the cooltool library exactly? – Lightman

can you show us the bower.json from cooltool? – Shemikashemite

@MaartenBicknese i've updated the question with the contents of .bower.json (note that it is not a main bower.json, there isn't one – Jiggerypokery

I believe you need a bower.json file as well as a main property within it in order for the injection to take place. – Decommission

@Decommission since bower.json wasn't automatically created for it during installation like the rest of the bower packages did, how would I force it to create one? – Jiggerypokery

Answer 1

Typically, you'll install something in this way:

bower cache clean
bower install component --save

However, if the added repo itself does not establish and bower.json rules for main and ignore, you'll need to add it yourself and check that in.

You'd do that in the following way:

1.- Fork the original repository for the component
2.- Add a bower.json file.
3.- Include in this file a 
    "main": ['path/to/file'], 
    "ignore":['array','of','things','to','ignore']
3.-bower install your forked git repo, and it will work

Martyr

Remember executing bower in the main path of your app!! – Waterside

After that, grunt will run your app with grunt serve – Waterside

I think the problem is that the d3-cloud repo itself doesn't have a main bower.json file – Jiggerypokery

did u tried to execute bower cache clean bower uninstall d3-cloud --save bower install d3-cloud --save – Waterside

if after doing that it´s not in your main bower.json dependencies, you must add them manually. But i think it´ll not be necessary – Waterside

after doing all of those things, it still was not there. – Jiggerypokery

chech my last edit. After running that, you will see the dependency adding by itself. I also think that when you are adding a repo manually, it usually does not add directly to your dependencies, but when adding with component name, it´s always added – Waterside

are you running the bower install in your main application dir? – Waterside

also, you are mis-understanding the problem. the main application's bower.json DOES include d3-cloud. that was never the problem. the problem is that upon running the app, GRUNT cannot add it to the index.html file along with all of the other bower dependencies because it cannot find a main entry... because the d3-cloud has no internal bower.json file – Jiggerypokery

did u tried deleting the whole directory , installing with the component name, not with the repo url, cleaning cache, and reinstalling? – Waterside

whole directory (for the module) – Waterside

Let us continue this discussion in chat. – Waterside