Загрузка глификонов из bootstrap-sass, включенного в зависимую библиотеку, с использованием веб-пакета

Question

У меня есть "библиотека компонентов", которая является отдельным пакетом. Этот пакет импортирует "bootstrap-sass". Он создает файл sass, который без проблем импортирует "bootstrap-sass".

Тем не менее, у меня впоследствии есть мой "реализационный проект", который импортирует "компонентную библиотеку" и, как следствие, "bootstrap-sass". Этот проект импортирует основной файл sass из "component-library" и, следовательно, впоследствии также "bootstrap-sass".

Это, однако, в настоящее время не удается из-за следующих ошибок:

ОШИБКА в./src/styles/app.scss (./node_modules/css-loader??ref--8-1!./node_modules/sass-loader/lib/loader.js??ref--8-2!./src/styles/app.scss) Модуль не найден: ошибка: не удается разрешить 'bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-регулярно.eot' в 'C:\inetpub\wwwroot\ creation- проект \ SRC \ стили

У меня есть следующие пакеты в "component-library":

"devDependencies": {
    "bootstrap-sass": "^3.3.7"
    "css-loader": "^1.0.0",
    "file-loader": "^1.1.11",
    "mini-css-extract-plugin": "^0.4.1",
    "node-sass": "^4.9.2",
    "sass-loader": "^7.0.3",
    "style-loader": "^0.21.0",
    "url-loader": "^1.0.1",
    "webpack": "^4.15.1",
    "webpack-cli": "^3.0.8"
 }

Я использую приведенную ниже конфигурацию webpack в "component-library":

module: {
  rules: [
    {
      test: /\.js$/,
      exclude: /(node_modules)/,
      use: {
        loader: 'babel-loader' 
      }
    },
    { test: /\.(png|jpg|svg|woff|woff2)?(\?v=\d+.\d+.\d+)?$/, loader: 'url-loader?limit=8192' },
    { test: /\.(eot|ttf)$/, loader: 'file-loader' },
    {
      test: /\.scss$/,
      use: [{
        loader: MiniCssExtractPlugin.loader,
      }, {
        loader: "css-loader", 
        options: { sourceMap: true }
      }, {
        loader: "sass-loader", 
        options: { sourceMap: true }
      }]
    }
  ]
},
plugins: [ 
  new MiniCssExtractPlugin({
    filename: "[name].css",
    chunkFilename: "[id].css"
  })
]

Ниже sass определен в моей "библиотеке компонентов":

$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/" !default;
@import "~bootstrap-sass/assets/stylesheets/bootstrap";

Как отмечалось, эти сборки в порядке. Однако импортирование этого в мою библиотеку реализации не работает.

У меня есть следующие пакеты в моей "библиотеке реализации":

"devDependencies": {
  "css-loader": "^0.28.11",
  "file-loader": "^1.1.11",
  "mini-css-extract-plugin": "^0.4.1",
  "node-sass": "^4.9.2",
  "sass-loader": "^7.0.3",
  "style-loader": "^0.21.0",
  "url-loader": "^1.0.1",
  "webpack": "^4.15.0",
  "webpack-cli": "^3.0.8"
},
"dependencies": {
  "component-library": "1.0.0"
}

У меня есть следующие настройки веб-пакета в моей "библиотеке-реализации":

  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader'
      },
      { test: /\.(png|jpg|svg|woff|woff2)?(\?v=\d+.\d+.\d+)?$/, loader: 'url-loader?limit=8192' },
      { test: /\.(eot|ttf)$/, loader: 'file-loader' },
      {
        test: /\.scss$/,
        use: [{
          loader: isDev ? 'style-loader' : MiniCssExtractPlugin.loader,
        }, {
          loader: "css-loader", 
          options: { sourceMap: true }
        }, {
          loader: "sass-loader", 
          options: { sourceMap: true }
        }]
      }
    ]
  },
  plugins: [ 
    new webpack.HotModuleReplacementPlugin(),
    new MiniCssExtractPlugin({
      // Options similar to the same options in webpackOptions.output
      // both options are optional
      filename: "[name].css",
      chunkFilename: "[id].css"
    })
  ]

И я включаю sass из "component-library" следующим образом:

@import "~component-library/lib/styles/app";

Это все работает нормально, когда я не импортирую bootstrap-sass в "component-library". Но когда я это сделаю, сборка не удалась.

Мне было интересно, если, возможно, мне нужно перезаписать "$ icon-font-path" в "реализации-библиотеке", но я не уверен с чем? Установка "bootstrap-sass" в "библиотеке реализации" решает мою проблему (потому что компилятор теперь находит глифы в ожидаемом месте, я думаю), но это кажется хакерским.

Любые советы приветствуются, я новичок в вебпаке.