Javascript Base64网页包url加载程序编码的图像未显示

我在向react（引导）项目添加背景图像时遇到问题

我已经找到了很多关于使用url/文件加载器将图像加载并编码为base64字符串，然后将它们添加到组件样式中的信息

但是，我的base64编码背景图像未显示。虽然加载正确

关于SO的类似问题（例如）暗示了编码错误（例如说字符串必须被拍打。但是我没有更改加载程序返回的字符串

以下是相关的jsx代码：

var background = require('url-loader!./../images/bg_1.jpg')

export default class MainView extends React.Component {
  render() {
    var s = {
      backgroundImage: 'url(' + background + ')',
      backgroundSize: "cover",
      backgroundRepeat: "no-repeat",
      width: "600px",
      height: "400px"
    }

    return  (
      <div id="MainView" style={s}>     
      </div>
    );
  }
}

---

感谢您的帮助。

在生成的DOM中，我可以看到多行base64内容

确保在base64 uri中的任何换行符之前，放置一个反斜杠

\

---

您可以尝试任何小的bas64 uri图像作为测试或检查

background

变量是否有换行符。

在生成的DOM中，我可以看到多行base64内容

确保在base64 uri中的任何换行符之前，放置一个反斜杠

\

---

您可以尝试任何小的bas64 uri图像作为测试或检查

background

变量是否有换行符。

我认为字符串中没有换行符。多行只是chrome.console.log（background.split（“\n”）.length）的换行符返回1。我认为字符串中没有换行符。多行只是chrome.console.log（background.split（“\n”）.length）返回1的换行符。

{
  test: /\.jpg/,
  exclude: /node_modules/,
  loader: "url-loader"
}