My Sage CSS seems to not be loading. I am using MAMP. I have found a similar post with the same issue, but the description of what was ‘fixed’ wasn’t really made clear for me.
See the following link for previous post: Main.css, bootstrap, and other assets/resources are not loading in browser - #3 by snatera15
Here’s an attachment of what I see in my console:
Here’s what my page looks like:
I checked the folders mentioned in the console errors to verify if the files were there, and they are and with all of the correct data. Maybe I am missing something very simple, but I could use some help if there’s a common happening here.
Thanks for any help!
define('WP_ENV', 'development'); to your wp-config.php if you’re not using Bedrock - https://roots.io/sage/docs/theme-installation/
Also make sure you run
gulp and then
gulp watch for MAMP. That is the development environment.
You only use
gulp --production for live server or if you want to commit the dist folder (some people do it that way). - https://roots.io/sage/docs/theme-development-and-building/
Take it like you have 2 modes of the theme DEVELOPMENT and PRODUCTION and you switch between them with those commands. So after production you need to run
gulp && gulp watch to get back into developer mode.
Oh and i noticed you’re missing the server name? or localhost:3000/ if using free mamp. So it may be a problem with your mamp setup.
To answer in order:
• I am using Bedrock
• Thanks for the gulp info. I wasn’t 100% I was doing it correctly, but now I see that I have been (which is a relief). I now have a better understanding with that in mind.
• Based on what you said about MAMP, I readjusted my settings(fixed my devUrl) and I now see the dev environment in my browser.
However, I still have the issue of not seeing the CSS. I took a closer look at the console errors and I see that those files have two forward slashes as opposed to the standard single forward slash (ex: http://app/themes/bowlnation-2015/dist/styles/main.css). To test to see if this was an issue, I removed the extra slash in developer tools and it worked. Any idea of how to apply this and have it output properly?
Oh wait, duh… The .env file had a trailing slash
(ex: incorrect:WP_HOME=http://localhost/ vs. correct: WP_HOME=http://localhost).
Thanks for your help!