I’m trying out Bower to install third-party scripts using Roots 7.0
When I install the package, it grabs all of the files and deposits them in /assets/vendor/vendorname
What is the recommended method of incorporating these in dev and production (minified) builds? I assume you just add an entry to the gruntfile for this additional script, since it doesn’t pick up the ones in /vendor automatically like /assets/js/plugins, then it gets concatenated with the other scripts, correct?
Correct, add them to the
jsFileList array in
Gruntfile.js after Bootstrap’s JS
Just to verify about this, after running
bower install --save [package name], it installs the files into the
assets/vendor folder. From there, do you go searching in each vendor folder for the various JS files and add them to
For example, I ran
bower install --save enquire for a project which saved into
assets/vendor/enquire. The JS file for enquire is located here:
assets/vendor/enquire/dist/enquire.js. There’s also a minified file as well.
I’d assume I have no reason to use the minified file and I can just reference the regular enquire.js file, correct?
I can also see and assume that the various JS files in each vendor folder will be located in different places and I’ll have to, in essence, fish for them throughout the various folders if they’re not in the root of each vendor folder.
Does all of this sound correct?
You’ve got it.
Sorry that there’s not better documentation right now.
what about css files? where to place them?
If you’re importing/downloading them using bower, and they’re less files, you can import into main.less (or wherever else you need it) like you would import any other less file. An example would be like so:
If you’re trying to import a css file, one option would be to ask LESS to treat it as a less file like so:
@import (less) "../vendor/package/less/styles.css";
If you’re not using bower, you can make a vendor folder in your less folder or put it wherever you want really, I’d say that comes down to personal preference.
Hope that helps.