How to use the react-loadable/webpack.ReactLoadablePlugin function in react-loadable

module.exports = function override(config, env) {
  if (process.env.REACT_APP_MAINTENANCE_MODE === 'enabled') {
    console.error('\n\n⚠️ ----MAINTENANCE MODE ENABLED----⚠️\n\n');
  }
  if (process.env.NODE_ENV === 'development') {
    config.output.path = path.join(__dirname, './build');
    config = rewireReactHotLoader(config, env);
    config.plugins.push(
      WriteFilePlugin({
        log: true,
        useHashIndex: false,
      })
    );
  }
  config.plugins.push(
    new ReactLoadablePlugin({
      filename: './build/react-loadable.json',
    })
  );
  config = injectBabelPlugin('react-loadable/babel', config);
  config = transpileShared(config);
  // Filter the default serviceworker plugin, add offline plugin instead
  config.plugins = config.plugins.filter(
    plugin => !isServiceWorkerPlugin(plugin)
  );
  // Get all public files so they're cached by the SW
  let externals = [];
  walkFolder('./public/', file => {
    if (file.indexOf('index.html') > -1) return;
    externals.push(file.replace(/public/, ''));
  });
  config.plugins.push(

const webpack = require('webpack');
const pkg = require('../package');

const now = new Date();
const banner = `
 ${pkg.name} v${pkg.version}
 ${pkg.repository.url}

 Copyright (c) 2019 ${pkg.author}
 Released under the ${pkg.license} license

 Date: ${now.toISOString()}
`;


const reactLoadablePlugin = new ReactLoadablePlugin({
  filename: '../build/react-loadable.json'
});

module.exports = (env = {}) => {
  return {
    entry: path.join(__dirname, "../projects/js/index.js"),
    output: env.latest ?
      {
        path: path.join(__dirname, `../build/${pkg.version.split('.')[0]}`),
        filename: `${pkg.name}.min.js`,
        chunkFilename: `[name].min.js`,
        jsonpFunction: 'webpackJsonp' + Date.now(),
        publicPath: `https://cdn.scaleflex.it/plugins/${pkg.name}/${pkg.version.split('.')[0]}/`
      } :
      {
        path: path.join(__dirname, `../build/${pkg.version}`),

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { ReactLoadablePlugin } = require("react-loadable/webpack");
var _ = require('lodash');

const htmlWebpackPlugin = new HtmlWebpackPlugin({
  template: path.join(__dirname, "../examples/js-plugin/src/index.html"),
  filename: "./index.html"
});
const reactLoadablePlugin = new ReactLoadablePlugin({
  filename: "../build/react-loadable.json"
});

module.exports = (env, options) => {
  const config = {
    entry: path.join(__dirname, "../examples/js-plugin/src/index.js"),
    output: {
      path: path.join(__dirname, "../examples/js-plugin/dist"),
      filename: "filerobot-uploader-widget.main.[chunkhash].js",
      chunkFilename: "filerobot-uploader-widget.[name].[chunkhash].js"
    },
    module: {
      rules: [
        {
          test: /\.(js|jsx)$/,
          use: ["babel-loader"],

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { ReactLoadablePlugin } = require("react-loadable/webpack");
var _ = require('lodash');

const htmlWebpackPlugin = new HtmlWebpackPlugin({
  template: path.join(__dirname, "../examples/js/src/index.html"),
  filename: "./index.html"
});
const reactLoadablePlugin = new ReactLoadablePlugin({
  filename: "../build/react-loadable.json"
});

module.exports = (env, options) => {
  return {
    entry: path.join(__dirname, "../examples/js/src/index.js"),
    output: {
      path: path.join(__dirname, "../examples/js/dist"),
      filename: "filerobot-image-editor.main.[chunkhash].js",
      chunkFilename: "filerobot-image-editor.[name].[chunkhash].js"
    },
    module: {
      rules: [
        {
          test: /\.(js|jsx)$/,
          use: ["babel-loader"],

isomorphicConfig,
  clientEnv,
  cssModulesIdentifier
} from '../config';

const isDev = process.env.NODE_ENV === 'development';
const cwd = process.cwd();

if (isDev) {
  require('dotenv').load();
}

export const isSSR = yn(process.env.SSR) || false;
export const analyzeBundle = yn(process.env.ANALYZE) || false;
export const basePlugins = {
  reactLoadablePlugin: new ReactLoadablePlugin({
    filename: path.join(__dirname, '..', 'react-loadable.json')
  }),
  isomorphicPlugin: new IsoPlugin(isomorphicConfig).development(isDev),
  miniExtractPlugin: new MiniCssExtractPlugin({
    filename: '[name].[chunkhash].css'
  }),
  definePlugin: new webpack.DefinePlugin({
    'process.env': mapValues(keyBy(clientEnv), env => {
      return JSON.stringify(process.env[env]);
    })
  }),
  bundleAnalyzerPlugin: new BundleAnalyzerPlugin()
};

const allowedPlugin = (plugin, key) => {
  switch (key) {

})
        );
      } else if (process.env.NODE_ENV === 'production') {
        addOfflinePlugin(config);
        removeEslint(config);
        config.plugins.push(
          new webpack.DefinePlugin({
            'process.env': {
              SENTRY_DSN_CLIENT: `"${process.env.SENTRY_DSN_CLIENT}"`,
              AMPLITUDE_API_KEY: `"${process.env.AMPLITUDE_API_KEY}"`,
            },
          })
        );
      }
      config.plugins.push(
        new ReactLoadablePlugin({
          filename: './build/react-loadable.json',
        })
      );
      config = transpileShared(config);
      return config;
    },
  },