title: Wepback. Loading chunk failed after using `import()`
body: <p>I'm working on <code>React</code> project and I had found out that one of budles files is too big and I need to split it. So, I tried to use <code>import()</code> sintax:</p>
  <pre class="lang-js prettyprint-override"><code>import React from 'react';
  import thumbnails from './thumbnails.json';
  
  export default class Portfolio extends React.Component {
      constructor(props) {
          super(props);
          import('react-image-gallery').then(module =&gt; {
              const ImageGallery = module.default;
              this.galleries = thumbnails.map((thumbnail, i) =&gt; {
                  let items = [];
                  for (let i = 0; i &lt; thumbnail.gallery.amount; i++) {
                      items.push({
                          original: `${thumbnail.gallery.href}/${i}.png`,
                          thumbnail: `${thumbnail.gallery.href}/${i}m.png`,
                      })
                  }
                  return (
                      &lt;div className=&quot;gallery&quot;&gt;
                          &lt;ImageGallery key={i} items={items} thumbnailPosition=&quot;left&quot; showPlayButton={false}
                                        onImageLoad={this.onGalleryLoad.bind(this, thumbnail.gallery.amount)}/&gt;
                          &lt;button className=&quot;gallery__close&quot; onClick={this.onCloseClick.bind(this)}&gt;&amp;times;&lt;/button&gt;
                      &lt;/div&gt;
                  )
              });
          });
      }
  </code></pre>
  <p><code>Portfolio</code> is the main component for one page. Later, when I open the page, there's an error <code>Uncaught (in promise) ChunkLoadError: Loading chunk 0 failed.</code><br />
  As I saw, JavaScript tries to load file <code>0.bundle.js</code> from the <code>portfolio</code> directory. While needed chunk is <code>0.chunk.js</code> that is located in the root directory.</p>
  <p>Here's my Wepback config:</p>
  <pre class="lang-js prettyprint-override"><code>const TerserPlugin = require('terser-webpack-plugin');
  
  module.exports = env =&gt; {
      const isDev = env.MODE === 'development';
  
      return {
          mode: isDev ? 'development' : 'production',
          devtool: 'source-map',
          entry: {
              './home/script': './home/script.jsx',
              './portfolio/script': './portfolio/script.jsx',
              './prices/script': './prices/script.jsx',
              './contacts/script': './contacts/script.jsx',
              './extra/script': './extra/script.jsx',
              './extra/locations/script': './extra/locations/script.jsx',
              './extra/poses/script': './extra/poses/script.jsx',
              './extra/stylists/script': './extra/stylists/script.jsx',
              './extra/studios/script': './extra/studios/script.jsx',
          },
          output: {
              path: __dirname,
              publicPath: __dirname,
              filename: '[name].bundle.js',
              chunkFilename: '[name].chunk.js',
          },
          module: {
              rules: [
                  {
                      test: /\.jsx?$/,
                      exclude: /node_modules/,
                      use: {
                          loader: &quot;babel-loader&quot;,
                          options: {
                              presets: ['@babel/preset-env', '@babel/react'],
                              plugins: [
                                  '@babel/plugin-proposal-class-properties',
                                  '@babel/plugin-transform-runtime',
                                  '@babel/plugin-syntax-dynamic-import',
                              ]
                          }
                      }
                  },
              ],
          },
          optimization: {
              minimize: !isDev,
              minimizer: [new TerserPlugin({
                  test: /.js$/i,
                  extractComments: false,
                  terserOptions: {
                      output: {
                          comments: false,
                      },
                  },
              })],
          },
          resolve: {
              extensions: ['.jsx', '.js'],
          }
      }
  };
  </code></pre>