HTML 解析 'srcset' 属性值失败，因为它在图像上有一个未知的描述符 - React - Webpack
Posted
技术标签:
【中文标题】HTML 解析 \'srcset\' 属性值失败，因为它在图像上有一个未知的描述符 - React - Webpack【英文标题】：HTML Failed parsing 'srcset' attribute value since it has an unknown descriptor on images - React - WebpackHTML 解析 'srcset' 属性值失败，因为它在图像上有一个未知的描述符 - React - Webpack 【发布时间】：2019-05-07 10:35:53 【问题描述】：可能值得一提的是，我正在使用 React 和 Webpack。
这个例子：
<img src="https://increasify.com.au/wp-content/uploads/2016/08/default-image.png" srcset="http://www.rangerwoodperiyar.com/images/joomlart/demo/default.jpg x2"
我的目标是利用srcset属性检测屏幕密度是否为x2，让浏览器判断使用大图。
图像显示正常，但它没有使用srcset 属性中描述的较大图像，用于视网膜或更高密度的屏幕。
它还在控制台中显示以下错误：
Failed parsing 'srcset' attribute value since it has an unknown descriptor. 来自vendor.bundle.js
Dropped srcset candidate "<URL>"
Dropped srcset candidate "http://www.rangerwoodperiyar.com/images/joomlart/demo/default.jpg"
我目前使用的是最新版 Chrome Version 70.0.3538.110
【问题讨论】：
【参考方案1】：我发现了问题，我把 x2 放在了应该是 2x 的愚蠢错误上。
【讨论】：
【参考方案2】：图片名称中的空格也会触发此错误：
assets/logo/logo 2x.png 2x,
必须改为
assets/logo/logo2x.png 2x,
【讨论】：
以上是关于HTML 解析 'srcset' 属性值失败，因为它在图像上有一个未知的描述符 - React - Webpack的主要内容，如果未能解决你的问题，请参考以下文章
当视口小于特定大小时，如何告诉 srcset 属性加载 NO 图像