如何为webpack2正确使用inline-svg-loader？

Question

我在我的模块中进行了设置并且构建没有错误，但是，我的svg最终看起来像这样：

在检查时看起来该模块在img的src属性中内联了svg：

如何让这个加载程序正确内联我的svg？

我的webpack.config.js文件如下所示：

module.exports ={
    entry: './template.html',
    output: {
        path: path.resolve(__dirname),
        filename: "index.html",
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use:[
                    'style-loader',
                    'css-loader',
                    'font-loader?format[]=truetype&format[]=woff&format[]=embedded-opentype'
                ]
            },
            {
                test: /\.html$/,
                use:[
                    'html-loader'
                ]
            },
            {
                test: /\.svg$/,
                loader: 'svg-inline-loader'
            },
            {
                test: /\.(jpg|png)$/,
                use:[
                    {
                        loader: 'file-loader',
                        options: {
                            name: '[name].[ext]',
                        }
                    }
                ]
            }
        ]

    },
    plugins: [
        new htmlWebpackPlugin({
            template: 'template.html'
        })
    ]
};