Here is my source HTML code
<picture aria-hidden="true">
<source srcset="
./img/find/video-preview-318.webp 318w,
./img/find/video-preview-635.webp 635w,
./img/find/video-preview-866.webp 866w
"
type="image/webp">
<source srcset="
./img/find/video-preview-318.jpg 318w,
./img/find/video-preview-635.jpg 635w,
./img/find/video-preview-866.jpg 866w
"
type="image/jpeg">
<img
class="video__poster"
sizes="(min-width: 1920px) 33vw, (min-width: 993px) 50vw, (min-width: 769px) 70vw, 100vw"
src="./img/find/video-preview-635.jpg"
alt="">
</picture>
After build, I get this
<picture aria-hidden="true">
<source srcset="
assets/img/video-preview-318.webpw-318.webp 318w,
assets/img/video-preview-635.webpew-635.webp 635w,
assets/img/video-preview-866.webpiew-866.webp 866w"
type="image/webp">
<source srcset="
assets/img/video-preview-318.jpgew-318.jpg 318w,
assets/img/video-preview-635.jpgiew-635.jpg 635w,
assets/img/video-preview-866.jpgview-866.jpg 866w"
type="image/jpeg">
<img
class="video__poster"
sizes="(min-width: 1920px) 33vw, (min-width: 993px) 50vw, (min-width: 769px) 70vw, 100vw"
src="./img/find/video-preview-635.jpg"
alt="">
</picture>
Why have the file names in srcset changed so much?
When I use the x descriptor, everything works if the files are named as follows
<picture aria-hidden="true">
<source srcset="
./img/hero/hero-bg.webp 1x,
./img/hero/[email protected] 2x"
type="image/webp">
<source srcset="
./img/hero/hero-bg.png 1x,
./img/hero/[email protected] 2x"
type="image/x-png">
<img class="hero__bg hero__bg--image" src="./img/hero/hero-bg.png" alt="">
</picture>
How then should the files be named when using w descriptor?
I am using html-loader
...
rules: [
{
test: /\.html$/,
use: [
'html-loader',
]
},
...
]
...
I need the file names to not change in srcset attribute using w descriptor after the webpack build