Sage 9 Browsersync Foundation js not correctly init

sage
,
1

It seems using Sage in development does not inject the JS files at the correct location for the Foundation JS files to work correctly.

My sticky navigation bar works perfectly fine in production but during development, it get it wrong and attaches the navigation to the bottom of page. Also the sticky events aren’t fired.

The only way to get working was to add the following code to the common.js.

  setTimeout(() => {
      $(document).foundation();
      $(document).resize();
    }, 500);

I believe this is caused by Browsersync injecting the js to head rather the footer of the page.