Javascript 网页包：html加载程序未解析srcset图像

我正在使用webpack2和html加载程序，如下配置所示：

{
            test: /\.html$/,
            loader: 'html-loader',
            options: {
                attrs: ['img:src', 'img:srcset'],
                minimize: true,
                caseSensitive: true,
                removeAttributeQuotes:false,
                minifyJS:false,
                minifyCSS:false
            },
            exclude: ['./src/main/webapp/index.html']
        }

我希望html loeader解析下面的srcset图像：

    <img
        sizes="(max-width: 3840px) 100vw, 3840px"
        srcset="../../../content/images/boy-with-plane_hnbkjs_c_scale,w_190.jpg 190w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_693.jpg 693w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_1013.jpg 1013w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_1280.jpg 1280w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_1505.jpg 1505w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_1718.jpg 1718w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_1923.jpg 1923w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_2104.jpg 2104w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_2295.jpg 2295w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_2459.jpg 2459w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_2626.jpg 2626w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_2787.jpg 2787w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_2959.jpg 2959w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_3119.jpg 3119w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_3259.jpg 3259w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_3400.jpg 3400w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_3552.jpg 3552w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_3705.jpg 3705w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_3782.jpg 3782w,
                ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_3840.jpg 3840w"
                            src=" ../../../content/images/boy-with-plane_hnbkjs_c_scale,w_3840.jpg"
        alt="">

---

即使为html加载程序设置了属性：['img:src'，'img:srcset']set，图像也无法解析

img:srcset

应该会起作用。任何帮助都将不胜感激。

我最终解决了我的问题，用

html-srcsets-loader

替换

html-loader

npm i html srcsets加载程序

 {
            test: /\.html$/,
            loader: 'html-srcsets-loader',
            options: {
                attrs: ['img:src', ':srcset'],
                minimize: true,
                caseSensitive: true,
                removeAttributeQuotes:false,
                minifyJS:false,
                minifyCSS:false
            },
            exclude: ['./src/main/webapp/index.html']
        }

即使在更改为

html srcsets loader

之后，我仍然会出现错误，因此我认为这是因为我的图像文件名。所以我把它们改名为

w_3552.jpg

，而不是

boy-with-plane\u-hnbkjs\u-c_-scale，w_3552.jpg

，同样地，我切换到了。我认为基本上是一样的，但是那个家伙更新了一点。

 {
            test: /\.html$/,
            loader: 'html-srcsets-loader',
            options: {
                attrs: ['img:src', ':srcset'],
                minimize: true,
                caseSensitive: true,
                removeAttributeQuotes:false,
                minifyJS:false,
                minifyCSS:false
            },
            exclude: ['./src/main/webapp/index.html']
        }