鍍金池/ 問答/HTML5  HTML/ 這個代碼該怎么優(yōu)化好呢

這個代碼該怎么優(yōu)化好呢

let importFn = (icon)=>{

import icon from "@/assets/monitor-data/" + icon + ".png";這行還報(bào)錯了

}

import icon1 from "@/assets/monitor-data/icon1.png";
import icon2 from "@/assets/monitor-data/icon2.png";
import icon3 from "@/assets/monitor-data/icon3.png";
import icon4 from "@/assets/monitor-data/icon4.png";
vue項(xiàng)目，本來打算寫一個函數(shù)，結(jié)果import那一行還報(bào)錯了，不知道為什么，大家都是怎么解決這種重復(fù)引入的呢### 問題描述

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

相關(guān)代碼

// 請把代碼文本粘貼到下方（請勿用圖片代替代碼）

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

回答
編輯回答
絯孑氣

用require，寫法也是有要求的

2017年12月10日 19:51
編輯回答
兔囡囡
  const context = require.context('@/assets/monitor-data', false, /\.png$/)
  const keys = context.keys()
  keys.forEach(path => {
    const img = context(path)
    console.log(img)
  })

這個方法引入了'@/assets/monitor-data'目錄下的所有png文件，如果需要過濾，可以在變量keys上調(diào)用filter()方法。也可以單獨(dú)建一個你需要引入的文件目錄，這樣就不用過濾了。
如果報(bào)錯了就不要使用webpack的別名，別名沒有測試過不知到可不可以用。

2017年11月11日 00:39