Any way to include a specific Bower file into main.js?

sage
1

I have a bower component that has a file that it depends on and I need to either make it load it with it’s bower file or I need to include it in the manifest directly. What is the best way to do this?

2

Forgot an example.

I have included a form validation plugin in bower and it loads the js and css file that is basic to it, but it also needs to load a framework specific js file ( for Bootstrap translations, not Bootstrap itself ). In my manifest I tried adding a line like:

"../bower_components/form.validation/dist/js/framework/bootstrap.js", 
"scripts/**/*",
"scripts/main.js"

But that doesn’t work.

Thanks.

3

Use overrides in bower.json https://github.com/austinpray/asset-builder/blob/master/help/troubleshooting.md

2 Likes
4

I remember when I was trying to include the isotope bower package in my main.js file and what a headache that was.

And I was too impatient with the override fix and simply couldn’t get it to inject the script I needed.
So, I simply pulled down isotope script into a plugins directory in my scripts folder like so:

"assets/scripts/plugins/isotope.pkgd.js"

But, isotope needs to be called before my theme specific js that includes custom isotope script, or else my script goes all whiny and undefined lol. So, too accomplish that, I had to make a quick change to my manifest.json file and order of the main.js dependency like this:

"dependencies": {
"main.js": {
  "main": true,
  "vendor": [
    "assets/scripts/plugins/isotope.pkgd.js",
    "assets/scripts/plugins/template.js"
  ],
  "files": [
    "scripts/main.js"
  ]
},

It might not be the prettiest solution, but it worked out fine for the moment. The main property must be declared first, followed by that troublesome bower package now plugin, and I also placed a custom script in my plugins folder that is included after.

Close it out with the main.js file and it worked.