Making sure vendor JS is called before custom JS (WordPress Sage)

On a fresh Sage 8 installation I was able to quickly install OwlCarousel using Bower, exactly as described in the Sage documentation without any issue; its script and styles were both correctly included before project scripts and styles.

Font Awesome requires a Bower override because its default Bower main property instructs Bower to use a LESS and a SCSS file; once I set it to just use SCSS it worked fine. Sage 8 ships with a working set of Bower overrides which you should use as an example. See here.

Something else is going wrong with your scripts or your asset builder setup if you're unable to manually add scripts in the correct order. I suspect your asset paths may be incorrect. The best way to troubleshoot and ensure your manifest points to the correct asset paths is to start an interactive node session in a new terminal window.

First run (in your theme dir):

node

Then run (also in your theme dir):

require('asset-builder')('./assets/manifest.json').globs.js

or (still in your theme dir):

require('asset-builder')('./assets/manifest.json').globs.css

The output will display both the assets' paths and the order they're being included.

If you modify manifest.json while running the gulp watch task it may be necessary to halt the task, run a default gulp build, and then restart your gulp watch task.

If you still have difficulty after viewing the asset-builder output using the steps above then please post (either here or on the Roots forum) the output here along with the installation steps you took when installing the vendor scripts and custom scripts you're attempting to use so that someone can attempt to recreate your environment.