使用 webpack url-loader 加载 svg 返回 js 文件

【问题标题】：Loading svg with webpack url-loader returns js file使用 webpack url-loader 加载 svg 返回 js 文件
【发布时间】：2016-01-12 21:19:27
【问题描述】：

我正在尝试使用 webpack 加载 svg 图像，如下所示：

const logo = require('./images/logo-white.svg')

请记住，这适用于我们所有的其他图片，它们都不是 svg。无论我使用哪种加载器组合，当我加载它放入的 url 或 data-uri 时，源代码如下所示：

module.exports = 'data-uri-that-is-the-actual-image'

【问题讨论】：

标签： javascript svg webpack

【解决方案1】：

我找到了一个“解决方案”，这确实是一个可怕的 hack，但考虑到我找不到任何其他方法，这里是：

function webpackSvgFixer(svg) {
  // Remove data...base64, headers, leaving just the base64
  svg = /data.*base64,(.*)/.exec(svg)[1]; 
  // Convert base64 to string, then remove module.exports = and quotes
  return /module\.exports = "(.*)"/.exec(atob(svg))[1];
};
const logo = webpackSvgFixer(require('./images/logo-white.svg'))

【讨论】：