Webpack load image inside of HTML

Question

Somewhere in the middle of my Angular template I have img tag:

<img src="../../images/error.gif" />

Until now I was using raw-loader with this simple configuration:

   test: /\.html/,
   loader: 'raw'

But after i read this i decide I need a change:

The raw-loader is supposed to turn a text file into a CommonJS module that exports the file contents as a string – nothing more.

What did I change:

So I changed my raw-loader to html-loader based on this article and this question.

    {
    test: /\.html$/,
    loader: [
        "html?" + JSON.stringify({
            attrs: ["img:src", "img:ng-src"]
        })
     ]
    }

And this: loader

{ test: /.gif$/, loader: "file" }

Based on this and this questions I added publicPath: "/assets" to my webpackconfig. And changed img tag on <img src=" { require('/assets/logo.png') } " />

My webpackconfig looks like:

webpack({
    entry: path.resolve(__dirname, './main.js'),
        output: {
            path: dir_dist,
            filename: 'custom-shared-lib.js',
            publicPath: "/assets"
        },
    module: {
        preLoaders: [
            {
                test: dir_bin,
                loader: path.resolve(__dirname, "./my-loader.js"),
                query: JSON.stringify(preLoaderQuery)
            },
        ],
        loaders: loader
    },
    plugins: [
        // Avoid publishing files when compilation fails
        new webpack.NoErrorsPlugin()
    ],
}, function(err, stats) {
    console.log(stats.toString());
});

While variabile loaders are:

[
    {
        test: /\.js$/,
        include: [dir_bin, dir_src],
        loader: 'babel-loader',
        query: {
            presets: ['es2015']
        }
    },
    {
       test: /\.html$/,
       loader: [
        "html?" + JSON.stringify({
            attrs: ["img:src", "img:ng-src"]
        })
      ]
    },
    { test: /.gif$/, loader: "file" }
]

Error:

This error happen while compiling:

Module not found: Error: Cannot resolve 'file' or 'directory' ./ { require('/assets/error.gif') }

I would be happy for any advice.