How to load unused images in webpack?

Question

webpack

Recently started using Webpack. Now I'm making a front for a Django project using Django Templates, etc. There is a problem with Webpack - I use the following rule to transfer images:

{
        test: /\.(jpg|png|svg)$/,
        loader: 'file-loader',
        options: {
          name: 'img/[name].[ext]'
        }
      }

But the problem is that it transfers only those pictures that are used in css files. What html uses - it doesn't wrap. Question: how to transfer all pictures to the dst folder?

Answer 1

Use Copy webpack plugin

const CopyWebpackPlugin = require('copy-webpack-plugin');
...
plugins: [
new CopyWebpackPlugin([
      { from: './src/img/', to: './img/' }
    ],
      {
        debug: true,
        ignore: [ '*.js', '*.css', '*.scss' ]
      }),
...
]