Handling vendor script files that require other (non-JS) files to be present in the same folder

Hello,

What’d be the best way to handle a situation where a vendor library that’s compiled with the asset-builder require other, non-JS files to be present in the same directory.

For instance. mediaelement.js library requires files like flashmediaelement.swf (Flush plugin) to be present in the same directory (in Bedrock workflow it’d be dist/scripts) as the main library file itself.

Since the Gulp build process would get rid of all files that are not explicitly declared in manifest.json, it seems not possible to meet that requirement (having both files alongside).

Would the only solution be to add a sperate task to Gulpfile that’d just copy the required non-JS files into dist/scripts on each build, or is there a “cleaner” way ?

There’s not really a clean way to handle this problem right now, unfortunately. When we switch to using Webpack in Sage 9, it will automatically handle situations like this.

2 Likes

For now - bower overrides maybe?

+1 We also need to solve this. Would be more than happy with a crude solution, considering there is no release date for Sage 9 at this stage.

Solution: use Webpack. More than happy to accept PR’s/code on the Sage 9 branch for it.

@Johnny_Bit, would adding extra files to overrides make the files like .swf live in the scripts folder? I wasn’t aware of that - this would be quite clean solution.

@luqo33, we have tried modifying the overrides in bower.json, and also spent some time trying to tweak the manifest.json. We had no luck at our end, but would love to hear if anyone came up with a working solution.

@ben, nice advice to use Webpack, unfortunately we are deep in the middle of a time-critical project that we are using the full Roots stack with, and it would be too risky to investigate an overhaul that big at this stage.

For the moment we are looking at creating an external directory, outside the assets folder, and including our video library scripts directly from the WordPress theme functions.

I resorted to a similar solution - I’m now including some external libralies directly from theme function where I provide their path in bower_components - this is for the library that relies on having different files in the same directory. I do not like this solution because now asset management is not fully centralized. I will have to look into Webpack should time allow.