When I try to add or remove lines of SASS or JS, the Browser will just keep refreshing…
I saw few posts, some people just add/remove the /
after the devUrl or publicPath, but it is completely not working for me. Could anyone help?
{
"entry": {
"main": [
"./scripts/main.js",
"./styles/main.scss"
],
"customizer": [
"./scripts/customizer.js"
]
},
"publicPath": "/wp-content/themes/local-theme/",
"devUrl": "http://localhost:8888/local-dev-wordpress/",
"proxyUrl": "http://localhost:3000",
"cacheBusting": "[name]_[hash:8]",
"watch": [
"app/**/*.php",
"config/**/*.php",
"resources/views/**/*.php"
]
}
What are you using for a local development environment?
MAMP for a local development environment. thanks!
OK, I just try others. And this one seems work for me with MAMP.
Changed
"publicPath": "/wp-content/themes/local-theme/",
"devUrl": "http://localhost:8888/local-dev-wordpress/",
TO
"publicPath": "/local-dev-wordpress/wp-content/themes/local-theme",
"devUrl": "http://localhost:8888/local-dev-wordpress",
@ben should the doc updated with this for MAMP user? Thanks!
I’m not sure you’ll find Roots recommending or supporting MAMP anytime soon…
ok, but at least there is some workarounds. For Sage, is good to setup with Trellis? Is hard to setup on MAC?
The Roots stack — which Sage is a part of — works great together.
On Mac, it is easy to set up.
Check out the Roots example project (Trellis, Bedrock, Sage 8) to see how they work together.
Example Roots stack project (Trellis, Bedrock, Sage) - GitHub - roots/roots-example-project.com: Example Roots stack project (Trellis, Bedrock, Sage)
Following the Trellis documentation verbatim will show you how to install Trellis:
https://roots.io/trellis/docs/installing-trellis/
Another Update:
When you do ‘yarn build:production’, you have to re-setup the publicPath
again to
"publicPath": "/wp-content/themes/local-theme",
Because if you are not removing, all the CSS would add local-dev-wordpress/
to your assets which would missing stuffs on Server.
/**
* If your publicPath differs between environments, but you know it at compile time,
* then set SAGE_DIST_PATH as an environment variable before compiling.
* Example:
* SAGE_DIST_PATH=/wp-content/themes/sage/dist yarn build:production
*/
if (process.env.SAGE_DIST_PATH) {
module.exports.publicPath = process.env.SAGE_DIST_PATH;
}
/**
* If you don't know your publicPath at compile time, then uncomment the lines
* below and use WordPress's wp_localize_script() to set SAGE_DIST_PATH global.
* Example:
* wp_localize_script('sage/main.js', 'SAGE_DIST_PATH', get_theme_file_uri('dist/'))
*/
// Object.keys(module.exports.entry).forEach(id =>
// module.exports.entry[id].unshift(path.join(__dirname, 'helpers/public-path.js')));
Another consequence of not using Trellis IMO. Dev-prod parity is king.
1 Like