webpack打包图片时遇到两个问题
一个是多生成了一个打包后的图片
一个是引用图片地址的问题
先说第一个问题
下面代码是我在webpack中使用file-loader的配置
配置好以后,在打包的时候,我在url引入的图片在打包的时候会出现两个打包的图片
上代码
使用的地方是
原因是我使用的webpack5,在打包的时候,css-loader,会把css中的图片打包一份,解决办法时
上代码
修改上面那个css-loader的配置后就可以解决那个问题了,css中的图片也可以正常显示了
另外一个问题
webpack中在js中引入图片要用require或者import的形式,不能直接用字符串的相对位置,因为字符串的相对位置在打包后找不到相应的位置
上代码