React导入图标/图像

Question

我有100个要导入的图标和图像。有没有办法消除在页面顶部写入如此多的导入语句？我正在考虑在一个单独的文件中写入一个导入语句，并将其嵌入顶部。

import basicAmenitiesIcon from '../../../../images/icons/wifi-sign.png'; 
import parkingIcon from '../../../../images/icons/parking.png'; 
... 

解决它的任何其他方式？我使用的WebPack和这里的配置：

{ 
    test: /\.(jpe?g|png|gif|svg)$/i, 
    loaders: [ 
     'file?hash=sha512&digest=hex&name=[hash].[ext]', 
     'image-webpack?bypassOnDebug&optimizationLevel=7&interlaced=false' 
    ] 
} 

Answer 1

是的，这是更多钞票，看我的答案在这里：https://stackoverflow.com/a/41410938/646156

var context = require.context('../../../../images/icons', true, /\.(png)$/); 
var files={}; 

context.keys().forEach((filename)=>{ 
    files[filename] = context(filename); 
}); 
console.log(files); //you have file contents in the 'files' object, with filenames as keys