How do I correctly use inline-svg-loader for webpack2?

Question

I set it up in my modules and it builds without error, however, my svg's end up looking like this:

and upon inspection it looks like the module inlines the svg in the img's src-attribute:

How can I make this loader inline my svg's correctly?

My webpack.config.js file looks like this:

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'
        })
    ]
};