反应 webpack 文件加载器 - 所需的变量 url

Question

我正在使用 webpack 和文件加载器插件。我想在 React 组件中设置背景图像，这样做：

let bgImageUrl = require(`../../images/image.jpg`);
let bgStyle = {backgroundImage: 'url(' + bgImageUrl + ')'};

<div className="calender__item__link" style={bgStyle} ></div>

这很好用。但是当我用这样的变量替换 bgImageUrl 时：

let bgImageUrl = require(`../../images/${event.image}`);

它不再工作了："Uncaught Error: Cannot find module './' at..."

有什么想法吗？我是否必须使用 url-loader 因为我正在使用 'url()'？

提前致谢。

Answer 1

发现错误：变量 ${event.image} 是通过 JSON 加载的。在少数情况下，它有一个字符串，在其他情况下它是空的。空的会抛出错误。

反应 webpack 文件加载器 - 所需的变量 url

react webpack file-loader - variable in required url

loader

reactjs

webpack