使用web pack加载svg资产

Question

我有以下weback加载器：

loaders: [
    {test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=image/svg+xml'}
]

我将所有svgs存储在/ res /文件夹中，但是当我构建项目时，我无法访问我的资源：

<img src="img.svg" />

我的装载机有什么问题？

Answer 1

没有更详细的信息，关于实际使用HTML片段的位置或者如何设置其他webpack配置，我最好的猜测是你需要实际需要.svg文件以便webpack处理它。

var svgImage = require('./img.svg');
/// svgImage can now be used in a template

当webpack通过您安装的各种加载器运行文件时，将创建一个名为哈希的新文件：img.svg -> {someHash}.svg

这可以在你的webpack配置中覆盖。

{test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=image/svg+xml&name=img-[hash:6].svg'}