search

mozilla / ssl-config-generator

Mozilla SSL Configuration Generator
https://ssl-config.mozilla.org/
Mozilla Public License 2.0
362 stars 60 forks source link

Update to use Webpack 5 #215

Closed gene1wood closed 9 months ago

gene1wood commented 9 months ago

With this change, the static assets like fonts are hosted at the root of the path instead of within their subdirectories like /fonts

I've been unable to figure out how to get this to work correctly where the SASS url references to fonts would point to /fonts. To work around this, I've commented out the outputPath in the asset/resource copying over of the fonts.

@april Can you tell at all how to get the URL paths to work correctly?

To see the issue, checkout this PR, npm install and npm run watch and you'll see that the resulting url paths to the font files are the root of the site instead of /fonts

gene1wood commented 9 months ago

@april It's gotta be related to the SASS processing. I can control where the files end up in the built directory just fine, but I've been unable to get the SASS loaders to consume the fonts scss file and render url CSS statements with a path present.

april commented 9 months ago

Sorry, I still haven't had any time to even look at this. Is it consuming the other CSS files fine, or is only the fonts one that isn't working?

gene1wood commented 9 months ago

@april The only uses of url() in the scss files are the fonts. I did try as a test just taking the content of the _fonts.scss file and adding it directly into index.scss in case the @import of _fonts.scss was the issue, but that didn't fix it.

I suspect, if there were any uses of url() elsewhere in the scss files, they too would assume that the referenced asset was in the root.

And in the current PR I have there, the fonts work, because I just said to put the font files in the root where the rendered CSS files reference them. So I could just merge this and it would work, it's just that the fonts would be in the root path instead of the /fonts/ directory (which would be a bit messy but not the end of the world)

april commented 9 months ago

Does url() work if you set it to a static path rather than a relative one?

gene1wood commented 9 months ago

@janbrasna Thanks so much! I dug a bit further based on your guidance but wasn't able to figure it out, but your suggestion of just using hosted fonts sounds great to me, so I'm going to do that. Thanks for your help!

april commented 9 months ago

Don't forget to add the font-src into the CSP at the top of the page, in the meta tags.

gene1wood commented 9 months ago

I forgot CSP blocks loading of fonts from the CDN. I'll fix that.

janbrasna commented 9 months ago

Actually you need style-src to @import from https://code.cdn.mozilla.net/fonts/zilla-slab.css