title: Images are loaded in external library, how to load them with webpack?
body: <p>first and foremost I need to say that I know little of fundamentals of Webpack, and this is probably why I can't find a solution.</p>
  
  <p>So I know in order to  load images I need to require a path instead of just typing it as a string <code>require('path/to/image')</code></p>
  
  <p>Then I got an external library where I need to pass a <code>path</code> property, where lay multiple images. It doesn't seem to work, so how can I load them into my website?</p>
  
  <pre><code> &lt;CountrySelect
      multi={false}
      flagImagePath="../../../public/flags/" //folder with multiple images
    /&gt;
  </code></pre>
  
  <p>Webpack config:</p>
  
  <pre><code>const path = require('path');
   const HtmlWebpackPlugin = require('html-webpack-plugin');
   const CleanWebpackPlugin = require('clean-webpack-plugin');
  
   const outputDirectory = 'dist';
  
  module.exports = {
    entry: './src/client/index.js',
    output: {
      path: path.join(__dirname, outputDirectory),
      filename: 'bundle.js',
      publicPath: '/',
    },
    module: {
      rules: [
        {
          test: /\.js$/,
          exclude: /node_modules/,
          use: {
            loader: 'babel-loader'
          }
        },
        {
          test: /\.css$/,
          use: ['style-loader', 'css-loader']
        },
        {
          test: /\.(png|woff|woff2|eot|ttf|svg|jpg|jpeg)$/,
          loader: 'url-loader?limit=100000'
        }
      ]
    },
    devServer: {
      historyApiFallback: true,
      port: 3000,
      open: true,
      proxy: {
        '/api': 'http://localhost:8080'
      }
    },
    plugins: [
      new CleanWebpackPlugin([outputDirectory]),
      new HtmlWebpackPlugin({
        template: './public/index.html',
        favicon: './public/favicon.ico'
      })
    ]
  };
  </code></pre>