How to set up Webpack in an Angular project to copy images from the src folder to the build folder?

Question

Angular

There is one question, until I figured it out: my webpack does not seem to see the picture. I took the content for the base files of the project from the following article about Angular . Based on the article Component Styles and Templates (end of article), I added modules for webpack raw-loader and html-loader to the project.
Lines of the webpack.config.js file for processing images:

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

I took from this article,
as I understand it, as a result, after the npm run build command, the 'assets' folder with pictures should appear in the 'public' folder, but this does not happen. The "file-loader" documentation says that you need to write the line "import img from './file.png';" in the js file as I understand it: "so that the file-loader can thus pick up the image file." Now I have a style in my "app.component.css" file:

#loginPopup {
background: url(./assets/images/authbg.jpg);
}

as far as I know import(@import) in scss(css) files is used to import other scss(css) files into the current scss(css) file, and the construction "import img from './file.png';" can only be written in js files. It looks like this can be implemented through some kind of js file that will need to be specially created, but according to the logic, webpack should, regardless of what I have written in the application files, take and copy all the pictures from the src folder to the public folder (or dist ) or webpack can't do that, or do you need to add some other modules for webpack? Please tell me what else is wrong or at least tell me in which direction to look? Thanks in advance
My project structure:

My webpack.config.js file:

webpack.config.js

const path = require('path');
const webpack = require('webpack');
module.exports = {
    entry: {
        'polyfills': './src/polyfills.ts',
        'app': './src/main.ts'
      },
   output:{
       path: path.resolve(__dirname, 'public'),     // путь к каталогу выходных файлов - папка public
       publicPath: '/',
       filename: "[name].js"       // название создаваемого файла
   },
   resolve: {
    extensions: ['.ts', '.js']
  },
   module:{
       rules:[   //загрузчик для ts
           {
               test: /\.ts$/, // определяем тип файлов
               use: [
                {
                    loader: 'awesome-typescript-loader',
                    options: { configFileName: path.resolve(__dirname, 'tsconfig.json') }
                  } ,
                   'angular2-template-loader'
               ]
            },{
               test: /\.html$/,
               loader: 'html-loader'
           }, {
               test: /\.css$/,
               include: path.resolve(__dirname,'src/app'),
               loader: 'raw-loader'
           },
           {
               test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
               loader: 'file-loader?name=assets/[name].[ext]'
           }
       ]
   },
   plugins: [
    new webpack.ContextReplacementPlugin(
        /angular(\\|\/)core/,
        path.resolve(__dirname, 'src'), // каталог с исходными файлами
      {} // карта маршрутов
    )
  ]
};

My package.json:

package.json

{
  "name": "My_project",
  "version": "1.0.0",
  "description": "My project description",
  "author": "Name <[email protected]>",
  "scripts": {
    "dev": "webpack-dev-server --hot --open",
    "build": "webpack"
  },
  "dependencies": {
    "@angular/common": "~8.0.0",
    "@angular/compiler": "~8.0.0",
    "@angular/core": "~8.0.0",
    "@angular/forms": "~8.0.0",
    "@angular/platform-browser": "~8.0.0",
    "@angular/platform-browser-dynamic": "~8.0.0",
    "@angular/router": "~8.0.0",
    "blueimp-md5": "^2.12.0",
    "body-parser": "^1.19.0",
    "connect": "^3.7.0",
    "connect-multiparty": "^2.2.0",
    "core-js": "^3.1.3",
    "express": "^4.17.1",
    "method-override": "^3.0.0",
    "mysql2": "^2.0.0",
    "rxjs": "^6.5.2",
    "zone.js": "^0.9.1"
  },
  "devDependencies": {
    "@types/node": "^12.0.0",
    "angular2-template-loader": "^0.6.2",
    "awesome-typescript-loader": "^5.2.1",
    "file-loader": "^4.0.0",
    "html-loader": "^0.5.5",
    "raw-loader": "^1.0.0",
    "typescript": "^3.5.0",
    "webpack": "^4.32.0",
    "webpack-cli": "^3.3.2",
    "webpack-dev-server": "^3.4.1"
  }
}

PS raw-loader currently using version 1.0.0, first I installed version 3.1.0 and when specifying styles through the styleUrls: ['./app.component.css'] construction, there was an error: "Expected 'styles' to be an array of strings ."