Webpack and file-loader for static images in Angular

I'm working in an Angular application and I have set up my webpack conf to use file-loader to load the images that I use.

The structure of my app is

/src
   /app
      /components
         /my-header
            my-header.component.ts
   /styles
   /assets
      mylogo.jpg

My webpack is using file-loader

{ 
   test: /assets\/.*(jpg|png|woff|woff2|eot|ttf|svg)$/, 
   loader: 'file-loader?name=assets/[name].[hash].[ext]'
}

And then I use it like this in my component

@Component({
  selector: 'app-header',
  template: `
    <header class="header">
      <div class="header__logo">
        <a routerLink="/">
          <img [src]="logo" />
        </a>
      </div>
      ...
    </header>
  `
})
export class MyHeaderComponent {
  logo: string = require('../../../assets/mylogo.jpg');
...

This is working, but it seems to me a bit of a pain having to require all the images that I need to use this way.

Since these are static images, is there a way to tell webpack to "scan" the templates (inline or not) and look for image files references so that I can just use this?

<img src="/assets/mylogo.jpg" />