一下討論問題的前提是專案已經使用了file-loader和url-loader，還沒首先說明問題的來源，在使用Vue的迴圈呈現有圖片的列表時，用v-for="item in items"，新增圖片的引用資源時，如果這樣寫<img :src="item.src">，你會發現執行後無法呈現圖片。這裡有兩種方法解決，一種是使用require("item.src")的方法，即迴圈修改每個item的src，item.src=require("item.src")，當然你也可以設一個新的變數來存require後的值，然後其他的不用修改，圖片就能正常顯示了。但是有個問題，每次顯示多個圖片都要迴圈require，是不是覺得很繁瑣，於是介紹第二種解決辦法，使用vue-lazyload外掛，直接npm install安裝就行了。下載後需要配置一下，如圖，error表示圖片載入失敗時呈現的圖片，loading表示圖片正在載入時的動畫。使用也非常簡單，將之前的“:src”改為“v-lazy”即可，<img v-lazy="item.src">，這樣就不需要每次都require了