I’m building an ecommerce site running on Trellis/Bedrock/Sage with WooCommerce and Sage’s default Bootstrap component.
I have read this article at least a dozen times over the course of the past few months, for this and other projects: https://roots.io/using-woocommerce-with-sage/. I’ve also read multiple topics around here saying that “this link contains literally everything you need to know to work with WooCommerce”. It’s a great resource, but it is lacking specifics at least with regard to the asset pipeline. In fact, the answer to this or a similar question would probably make a useful addition to that article.
What’s the best way to get the WooCommerce styles into my Sage theme’s build process? I installed WooCommerce as a standard WP plugin (it isn’t on Composer and I didn’t want to mess with a custom repo or using it as a git submodule or subtree.
I could just let WooCommerce run it’s own CSS within it’s plugin directory and overwrite stuff, but I’d really rather avoid that. I want to try to keep the CSS as lean as possible. So, I copied WooCommerce’s SCSS files into my Sage assets/styles
directory in a woocommerce
subdirectory.
I figured at this point I can either do something with manifest.json, bower.json, or maybe even NPM’s package.json5, but I just don’t know how I should be doing so. What I’ve ended up doing is just including the various WooCommerce SCSS files within my main.scss file in my assets directory. This seems to work, but also feels clumsy.
Has anyone done a project with Sage and WooCommerce and found a good way to streamline the asset pipeline between the two?