鍍金池/ 問(wèn)答/HTML/ webpack 打包圖片 大于10KB 的 不顯示?。。?！

webpack 打包圖片 大于10KB 的 不顯示?。。?！

打包后發(fā) 服務(wù)器上 只有圖標(biāo)顯示了，其他大于 10KB 的圖片都不顯示?。。∪绻?limit 值加個(gè)0（小于100KB就可以顯示了）。有其他辦法嗎？？？？？？

{

    test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: utils.assetsPath('img/[name].[hash:7].[ext]')

}

clipboard.png

安裝 file-loader 后也不管用。不的為什么。。。。。。

clipboard.png
修改build 路徑后 css 可以顯示了，但是 圖片還是不顯示，報(bào)錯(cuò)。。。

clipboard.png

問(wèn)題出現(xiàn)的環(huán)境背景及自己嘗試過(guò)哪些方法

相關(guān)代碼

// 請(qǐng)把代碼文本粘貼到下方（請(qǐng)勿用圖片代替代碼）

你期待的結(jié)果是什么？實(shí)際看到的錯(cuò)誤信息又是什么？

回答
編輯回答
乖乖瀦

這個(gè)不顯示怕是路徑錯(cuò)誤吧，可以打開(kāi)chrome調(diào)試工具看一下error。

至于為什么調(diào)整limit會(huì)顯示，因?yàn)檫@個(gè)屬性的意思是圖片的大小小于這個(gè)值，那么直接編碼程base64寫(xiě)進(jìn)代碼中，不走path路徑，所以正常顯示了。一旦圖片大小超過(guò)這個(gè)值，那么就要打包輸出圖片到某個(gè)文件夾，具體看您的配置。

建議通過(guò) output里面的publicPath或者輸出hash兩方面查找原因，先用調(diào)試工具定位錯(cuò)誤吧。

如果不能解決，歡迎再次討論，

2017年1月5日 15:21