require引入的圖片和直接引入的圖片到底有什麼區別?

require 是 node 中的一個方法,他的作用是 “用於引入模塊、 JSON、或本地文件”。 也就是說如果我們使用 require 來引入一個圖片文件的話,那麼 require 返回的就是用於引入的圖片(npm 運行之後圖片的編譯路徑)。 而如果使用字符串的話,那麼則是一個 string 類型的固定字符串路徑。

我們知道,src 中引入的圖片應該爲圖片的本身路徑(相對路徑或者絕對路徑),而 vue 項目通過 webpack 的 devServer 運行之後,默認的 vue-cli 配置下,圖片會被打包成 name.hash 的圖片名,在這種情況下,如果我們使用固定的 字符串路徑則無法找到該圖片,所以需要使用 require 方法來返回 圖片的編譯路徑。

簡單的說,使用require定義之後,你就可以動態使用了,不用require你就只能寫死的。不用的話, :src="’…/img/image.jpg’" 會被解析爲字符串

require 方法介紹: http://nodejs.cn/api/modules.html#modules_require_id

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章