Как оптимизировать пользовательскую библиотеку в node_modules, используя SplitChunksPlugin. (Webpack / React)

Question

Я создал библиотеку для проекта React, над которым я работаю, и хотел бы оптимизировать эту библиотеку, разбивая каждый файл на свои части, используя опцию splitChunks.В этой библиотеке у меня есть 2 служебных файла, каждый из которых использует lodash.Я объединяю свои служебные функции, используя Webpack, и разделяю node_modules в отдельный блок.Однако, когда я связываю эту библиотеку и пытаюсь использовать свои служебные функции, я сталкиваюсь с ошибкой.** Я хочу оставить lodash у поставщиков, чтобы сохранить на стороне клиента и предотвратить дублирование библиотек lodash.

Это мой желаемый выходной пакет, который, похоже, не работает:

Это без добавления lodash впакет, который работает, но не нужен, так как lodash дублируется.

Util1

import {defaults} from 'lodash';

export default class Util1 {

    useLodash() {
       return defaults({ 'a': 1 }, { 'a': 3, 'b': 2 }); 
    }

    sayHello(){
        return 'hello';
    }
};

Util2

import {partition} from 'lodash';

export default class Util2 {

    useLodash() {
        return partition([1, 2, 3, 4], n => n % 2); 
     }

     sayBye(){
         return 'bye';
     }
};

webpack.config.js

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
module.exports = {
  entry: {
    Util1: './src/utils/Util1/index.js',
    Util2: './src/utils/Util2/index.js'
  },
  output: {
    path: path.join(__dirname, '/dist'),
    filename: '[name]/index.js',
    library: 'mylibrary',
    libraryTarget:'amd'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      }
    ]
  },
  plugins: [
    new BundleAnalyzerPlugin(),
  ],
optimization: {
  splitChunks: {
      cacheGroups: {
        commons: {
          test: /[\\/]node_modules[\\/]/,
          name: 'vendor',
          chunks: 'all',
        }
      }
  }
}
};

Использование служебной библиотеки в реактивном проекте после ссылки пряжи

import React, { Component } from 'react';
import './App.css';
import Util1 from 'mylibrary/dist/Util1';


class App extends Component {

  render() {

    const u1 = new Util1(null);
    console.log('u1', u1.useLodash());
    return (
      <div><p className="example">React App</p></div>
    );
  }

}

export default App;

Конфигурация React Project Webpack

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
  entry: './src/index.js',
  output: {
    path: path.join(__dirname, '/dist'),
    filename: 'index_bundle.js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
        template: './src/index.html'
    })
  ]
};

Я строю свои пакеты и указываю свой реальный проект React на эту библиотеку, используя ссылку пряжи, и пытаюсь использовать мои функции Utility.но получаю ошибку:

App.js:40 Uncaught TypeError: _Util2.default is not a constructor
    at App.render (App.js:40)
    at finishClassComponent (react-dom.development.js:14741)
    at updateClassComponent (react-dom.development.js:14696)
    at beginWork (react-dom.development.js:15644)
    at performUnitOfWork (react-dom.development.js:19312)
    at workLoop (react-dom.development.js:19352)
    at HTMLUnknownElement.callCallback (react-dom.development.js:149)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:199)
    at invokeGuardedCallback (react-dom.development.js:256)
    at replayUnitOfWork (react-dom.development.js:18578)

Я также проверял

Util1.useLodash();

но я получаю ошибку

App.js:40 Uncaught TypeError: _Util2.default.useLodash is not a function
    at App.render (App.js:40)
    at finishClassComponent (react-dom.development.js:14741)
    at updateClassComponent (react-dom.development.js:14696)
    at beginWork (react-dom.development.js:15644)
    at performUnitOfWork (react-dom.development.js:19312)
    at workLoop (react-dom.development.js:19352)
    at HTMLUnknownElement.callCallback (react-dom.development.js:149)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:199)
    at invokeGuardedCallback (react-dom.development.js:256)
    at replayUnitOfWork (react-dom.development.js:18578)

Любая помощь будет принята с благодарностью, я 'я бился головой о стену, пытаясь понять, почему это не сработает.