Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to include bower components in harp

I've got a project in Harp with this standard directory structure:

enter image description here

(highlighted parts are in my git, bower_components and www should be created upon install/compile).

When I install a new bower component, I can easy include its css in my Less, e.g.

@import "../../bower_components/some-component/stuff";

but what would be the "right" way to use javascripts (or other static assets, for that matter)? Of course, I could simply copy them over, e.g.

cp bower_components/some-jquery-plugin/plugin.js public/js/plugin.js

and this is what people actually do, but I'm looking for something better. Ideally, I'd like to avoid makefiles/gruntfiles completely and be able to initialize my project with just bower install:

   git clone myproject // this will create public/ and bower/harp.json
   cd myproject
   bower install       // this populates bower_components
   harp server/compile // just works...

In other words, I'd like to somehow reference static assets that reside in bower_components from inside the public dir. Symlinking is not an option because harp compile doesn't resolve symlinks.

like image 909
georg Avatar asked Mar 10 '15 12:03

georg


1 Answers

The quick and dirty solution is to tweak the .bowerrc settings to change the default directory that bower components are installed to.

.bowerrc

{
  "directory": "public/js/bower"
  ...
}

Now a bower install command will drop those dependencies directly into your public/js/bower directory.

Upside: It's a quick "one-liner" in your .bowerrc

Downside: All of the source files for those dependencies get deployed publicly unless you have a deployment script that cleans up the unnecessary files. Then again, if they are all open source projects that you are using then it really doesn't matter if those extra files are sitting on your web server.

like image 114
Greg Burghardt Avatar answered Sep 28 '22 12:09

Greg Burghardt