如何在 webpack 中 url-loader 多张图片？

Question

我的 webpack 配置：

{ test: /\.(png|jpg)$/, loader: 'url?limit=8192' }

在我的项目中，我必须像这样加载图像：

import homeBg1 from './image/homeBg1.jpg';
import homeBg2 from './image/homeBg2.jpg';
import homeBg3 from './image/homeBg3.jpg';

操作比较麻烦，谁能给我指点一下？谢谢！

Answer 1

此代码将从 image 文件夹导入所有 *.jpg 文件：

var requireContext = require.context("./image", true, /^\.\/.*\.jpg$/);
requireContext.keys().map(requireContext);

关于 require.context 的更多信息：https://webpack.js.org/guides/dependency-management/#requirecontext