Sage9 - yarn build fails when using a .webp file in css?

I have an old sage 9 theme, I would like to use webp in my CSS

    &.v-0 {
      background-image: url('../images/menu/whatwedo-xxl.webp');

but yarn build resuls in:

 error  in ./resources/assets/images/menu/whatwedo-xxl.webp

Module parse failed: Unexpected character '' (2:0)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)

it seems that it doesn’t like the webp format, because the same CSS code with the jpg works without any problem.

is there an easy fix or because sage 9 is old, i should stick to JPG and avoid this new image format (webp)?
Could anyone point me in the right direction?


I think you should use some webp loader in webpack with Sage 9