CSS URL prefix option

[guybedford]

When bundling, URLs in CSS files are output as baseURL-relative. It can be worth having an option to set a custom prefix here - say System.clientBaseURL or something like that to inject during the build.

Perhaps the simplest is just to call it basePrefix?

Getting the name right is probably the hardest part.

[jamesgorrie]

Isn't it already applying the baseURL when clean-cssing? When testing it - it seems to, but the URL is still mismatched.

[guybedford]

Client and build baseURLs are separate things, so we need to take both into account for the final URL.

[jamesgorrie]

Ah, I see.

As, while you're developing - the client baseURL is going to be used - surely it makes sense to keep them as one? Unless perhaps you wanted to have your prod environment use a different path to your dev, but it might be worth waiting for that use case?

Do you think it'd be too coupled to just pass the baseURL through here as a default?

[guybedford]

The client baseURL is a browser URL relative to the browser public folder root. The server baseURL is a server path relative to the package.json to the same folder. Understanding that distinction is important to know how builds work - it should be better documented I know.

[theefer]

I have tried a variety of clean-css options but I can't seem to find a way to inject an absolute (or even relative) prefix to all image URLs. Docs seem to hint at using a combination of relativeTo and root but I can't seem to find the right combination...

[guybedford]

Ideally we should upgrade this plugin to use PostCSS. Help managing this plugin would be incredibly welcome.

[theefer]

Could you elaborate on what you see us use PostCSS for in this plugin? Just rebasing URLs to allow a prefix? Replacing some of the work clean-css does? Would it become more of a (hardcoded for now) post-processing pipeline?

[guybedford]

It seems like a better base project to use here than CleanCSS for providing more flexibility around the re-normalization of CSS process, and having the clean css process as a transformer on top of that. Then yes it does open the door to a processing pipeline as well, which would be nice to offer to users via meta-configuration of css transformers.