Hey guys,
When I yarn start my fonts show up just fine at my proxyUrl. When I run ‘yarn build’ , or yarn build:production, my font paths and CSS background-image urls are broken. I’ve been looking at this too long and I’m guessing I’m doing something really obviously stupid.
Here is my assets/config.json :
{
"entry": {
"main": [
"./scripts/main.js",
"./styles/main.scss"
],
"customizer": [
"./scripts/customizer.js"
]
},
"publicPath": "/wp-content/themes/eightytwenty",
"devUrl": "http://localhost:8888/8020/kara_urie_lott",
"proxyUrl": "http://localhost:3000/8020/kara_urie_lott",
"cacheBusting": "[name]_[hash:8]",
"watch": [
"app/**/*.php",
"config/**/*.php",
"resources/views/**/*.php"
]
}
…and this image shows my proxyUrl and the font path it’s loading:
…and this image show my devUrl and the font path it’s trying to load:
As I look through the docs and community forum I keep seeing answers to similar problems such as prepending a backslash to the publicPath. These solutions don’t work for me.
Any help would be so greatly appreciated, thanks in advance.
ben
March 4, 2019, 3:25pm
2
This should ideally be just a local testing domain and not a domain + folders
1 Like
Thanks for the reply @ben , I ended up moving the folder path to the publicUrl and it worked locally, and then just removed it on my production server.
mmirus
March 4, 2019, 8:56pm
4
Hey, @caitlindev ! This might help you with the difference between your dev and production environments.
/**
* 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')));
Sorry for the delayed response @mmirus , going to give this a shot. I’ll report back if I run into any problems. Thanks!
1 Like
