Sorry to revive this post but it is related.
I have done a some more local development and I recently pushed some changes via SFTP to the WP Engine host, following the below routine:
- composer install --no-dev
- yarn build:production
- SFTP upload all files except the node_modules folder
After I run the yarn build:production
locally the styling of the site breaks, I notice a lot of my custom SCSS is not added (note: all the custom scss I’m adding to existing files like _header.scss and _global.scss).
I then upload all the files to the production server and it is also broken there. I then delete the /dist folder on the server to make sure that it’s not a caching issue and that doesn’t help either.
When I revert to running yarn build
everything works fine.
I’ve had a look at this thread here - Compiled CSS doesn't work as it should in production
I’m using a different implementation of the mobile menu (using the old Bootstrap span element approach) - so I know it’s not related to that issue.
Any ideas on how I can go about debugging this?
I’m using Trellis/Bedrock/Sage locally and just deploying the theme folder with the edited view.php file as mentioned in my earlier post.
Update 1: I also noticed that after the production build, images loaded via css ("../images/foo.jpg")
are then converted to src: url(/app/themes/mytheme/dist/font.eot)
rather then src: url(/wp-content/themes/mytheme/dist/font.eot)
Is there a way to get it to change all instances of /app/
to /wp-content/
each time a yarn buid:production
is run for example? I figured it would keep the relative urls the same rather then changing the ../
to /app/mytheme/
.
Update: I found solutions to both of my issues, it appears I had “end of the day brain” at the time of posting this!
Solution 1: it was in fact the solution mentioned in the GitHub that fixed the issue (https://github.com/roots/sage/issues/2017) even though I’m not using that menu, you still need those variables in there.
Solution 2: I forgot to check my own notes, since my remote server doesn’t have bedrock it was simply a matter of running the below
SAGE_DIST_PATH=/wp-content/themes/mytheme/dist/ yarn build:production
Many thanks.