Error resolving root-relative image paths in css for external images

Bug report

What is the current behavior?

When encountering a root-relative url (IE: url(/path/to/image.jpg) ) in css, Webpack attempts to process the asset and throws an error if it fails to do so.

This is fine if the image is local to the repository, or otherwise available at build-time. But if the image is expected to come from another service, the build will fail.

If the current behavior is a bug, please provide the steps to reproduce.

Including this rule in a css class will cause this to happen:

background-image: url(/path/to/image.jpg);

I reproduced the issue in this repo .

Adding this Webpack magic-comment fixes it for dev but not production: /* webpackIgnore: true */

Correction:

The magic-comment works for css files in production, but not for sass files.

Either way; you should not need magic-comments to make this basic functionality work

What is the expected behavior?

Webpack should leave the path as is and not attempt to process the asset. This worked well in Webpack 4.

Other relevant information: webpack version: 5.64.4 Node.js version: 17.6.0 Operating System: Ubuntu Linux Additional tools:

[alexander-akait]

https://github.com/webpack-contrib/css-loader#object

[dovidweisz]

Thank you