取得資料夾內文件 #

在建構網頁時，有時候會需要將整個資料夾內的圖檔全部放到頁面上，我過很多有關於vue、vite的網路發問，大多會出現像這樣的解答 :

mounted() {
    this.importAll(require.context('../assets/images/path/', true, /\.png$/));
},

由於 require.context 在 vite 當中無法辨識，於是官方提供了一個 glob import 的方法 :

const images=import.meta.glob('/assets/images/path/*',{import:'default',eager:true})

執行後會出現像這樣情形的陣列組合 [ {"/path/*":"/path/*"} , {"/path1/*":"/path1/*"}]...之類的，它把資料夾內所有指定的檔案，全都擺上，而且路徑與值全都一樣，有點難辨識。

參考 #

How to get all the image files in a directory using vue.js / nuxt.jsvite Glob Import