Css-loader: url behavior after updating to V4.X.X

[blasterbug]

Hello,
Before the update to v4 (when they changed the way absolute URLs are treated). I did not have any problem with using a mix of absolute and relatives URLs (i.e. url(/something/somefile.png) vs. url(./img.png)).
My problem is that I use absolute paths to get files (the fonts for instance) which are saved by a CDN while I use relative paths to convert specific assets to inline files.

I would like to know if there is a way to get the same behaviour as before or if it's something not considered and if it would make sense to and an option (maybe similar to importLoadersto choose the behaviour we want/need.

[alexander-akait]

It is expected and it is in CHANGELOG, no new options, you have url filter (https://github.com/webpack-contrib/css-loader#url as Function) to exclude some urls, you can use alias to provide real path to assets, please use search before post the issue, it was answered a lot of time

[alexander-akait]

My recommendation avoid this, your assets should be processed by webpack (minimize and etc), if you need using real absolute urls you should using http(s)?: protocol (they will be ignored by default), using /something/file.png is not good, if somebody will be able to change https on http on your server it is allow to get assets by http protocol (it is unsafe)

[lensbart]

I think the CHANGELOG for 4.0.0 can be improved by copying “improve url() resolving algorithm (bc19ddd)” to the section Breaking Changes (now it is under Features). It took me quite a while to figure out that I had to set options.url: false to get the previous behaviour.

Thanks

[alexander-akait]

Feel free to send a PR to docs, anyway I do not recommend options.url: false

[lensbart]

Feel free to send a PR to docs, anyway I do not recommend options.url: false

Before I send a PR, could you kindly explain why this is a bad practice, so that I can include this explanation?

Thanks in advance

[alexander-akait]

@lensbart Because without the url option all assets from CSS will not processed and it is bad idea

[waf]

I think to get the old behavior, you can do something like:

url: (url, resourcePath) => {
    return !url.startsWith('/'); // don't try to process absolute paths (e.g. nginx aliases, iis directories etc)
},

This way, it will only try to process relative paths. If you have an absolute path like /static/img/cat.png it will leave it alone. The use case is that /static/ might not exist on disk at build time; it could be mapped by the webserver.

[joe223]

@alexander-akait https://github.com/webpack-contrib/css-loader#url

Enables/Disables url/image-set functions handling. Control url() resolving. Absolute URLs are not resolving.

That made me quite confused. Absolute URLs are not resolving means that url('/foo/bar.png') won't be resolved even if url is true. Right?

But we still get Error

Error: Can't resolve '/foo/bar.png' in ....