How to make webpack load files for video tags, video(poster) tags and so on by itself?

Question

Node.js

config

spoiler

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const merge = require('webpack-merge');
const webpack = require('webpack');

const pug = require('./webpack_config/pug');
const devserver = require('./webpack_config/devserver');
const sass = require('./webpack_config/sass');
//const compass = require('./webpack_config/compass');
//const resourcesLoader = require('./webpack_config/resources.loader');
const css = require('./webpack_config/css');
const extractCSS = require('./webpack_config/css.extract');
const uglifyJS = require('./webpack_config/uglifyjs');

//babel
const babel = require('./webpack_config/babel');
//const babelLoader = require('./webpack_config/babelLoader');

const typescript = require('./webpack_config/typescript');

//file-loader
const images = require('./webpack_config/images');
const fonts = require('./webpack_config/fonts');


const PATHS = {
  source: path.join(__dirname, '_autovep'),
    build: path.join(__dirname, '_autovep-build'),
};

const common = merge([
    {
        entry: {
      'index': PATHS.source + '/pages/index/index.js',
      
      /* end */
    },
        output: {
      path: PATHS.build,
      filename: './assets/js/[name].js',
      library: '[name]',
            libraryTarget: 'umd',
            libraryExport: 'default',
            umdNamedDefine: true,
    },
        plugins: [
      new HtmlWebpackPlugin({
        favicon: '_autovep/favicon.png',
        filename: 'index.html',
        chunks: ['index', 'common'],
        template: PATHS.source + '/pages/index/index.pug',
      }),	
                  
      /* end */
      
      new webpack.optimize.CommonsChunkPlugin({
        name: 'common'
      }),			
      
      new webpack.ProvidePlugin({
        $: 'jquery',	 
        jQuery: 'jquery'    
      }),
    ],
    },

    pug(),
  images(),
  fonts(),
]);

module.exports = function(env) {
  process.env.mode = env;
    if (env === 'production') {
    return merge([
      common,
      extractCSS(),
      uglifyJS,
      babel,
    ]);
  } else if (env === 'development') {
        return merge([
            common,
            devserver(),						
      sass(),
      //compass(),
      //resourcesLoader(),
      css(),
      babel,
        ]);
    }
};

I use file loader like this

spoiler

module.exports = function() {
  return {
    module: {
      rules: [
        {
          test: /\.(jpg|png|svg|gif|ico)$/,
          loader: 'file-loader',
          options: 
            {
              name: 'assets/images/[name].[ext]'
            },
        },
        {
          test: /\.(mov|mp4)$/,
          loader: 'file-loader',
          options: 
            {
              name: 'assets/video/[name].[ext]'
            },
        },
      ],
    },
  };
};

And jade

spoiler

/* main */
module.exports = function() {
    return {
        module: {
            rules: [
                {
                    test: /\.pug$/,
          use: [
            'html-loader',
            'pug-html-loader?{"pretty":true,"exports":false}'
          ],
                }
            ]
        }
    };
};

By default, only files for img tags are loaded.
img(src='../../images/logo/logo.svg' alt='')
At the same time, correctly changing links to files inside the folder with the build.
All others do not pull up.
img(src=require throws an error.
I tried to set the html loader settings separately, like

spoiler

module: {
    rules: [
      { test: /\.jpg$/, use: [ "file-loader" ] },
      { test: /\.png$/, use: [ "url-loader?mimetype=image/png" ] }
    ]
  },

Did not work. What else can be done?
UPD:
found a solution. by going to node_modules and editing the html-loader file, adding the tags you want

var attributes = ["img:src", "source:src", "video:poster"];

But it's somehow very strange

Answer 1

found a solution. by going to node_modules and editing the html-loader file, adding the desired tags
var attributes = ["img:src", "source:src", "video:poster"];