Интеграция веб-пакета с начальной загрузкой и меньшим загрузчиком

Question

Я использую webpack для сборки и less-loader для преобразования less в css.В одном из меньших файлов я хочу импортировать загрузочный файл следующим образом.

@import "~bootstrap/less/bootstrap";

Но он не может определить путь к файлу начальной загрузки узла.Что я здесь упускаю.

Ошибка:

Can't resolve 'bootstrap/less/bootstrap.less' in '/Users/abc/workspace/codebase/hybris/bin/custom/some/somestorefront/web/webroot/WEB-INF/_ui-src/less/pages'
      in /Users/abc/workspace/codebase/hybris/bin/custom/some/somestorefront/web/webroot/WEB-INF/_ui-src/less/pages/account-dashboard-page.less 

webpack.common.js

const path = require('path');
var CommonsChunkPlugin = require(
    "./node_modules/webpack/lib/optimize/CommonsChunkPlugin");
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
  entry: {
    'styles': ['./web/webroot/WEB-INF/_ui-src/less/index.less'],
    'index': ['babel-polyfill', './web/webroot/WEB-INF/_ui-src/js/index.js']
  },

  //Include sourcemap for debugging
  devtool: 'source-map',
  output: {
    filename: "[name].js",
    path: path.resolve(__dirname, 'web/webroot/_ui/dist')
  },
  plugins: [
    //Used to extract common CSS in a css file.
    new ExtractTextPlugin('styles.css'),

    //Extract Common JS into a single file
    new CommonsChunkPlugin({
      name: "common-libs",
      filename: "common-libs.js",
      minChunks: 2,
    })
  ],
  module: {
    rules: [
      //Use Babel to transpile JS to proper version of ES.
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['babel-preset-es2015-ie']
          }
        }
      },
      //Use ESLint to enforce JS code quality see .eslintrc.json for rules.
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: "eslint-loader"
      },
      //Use ExtractTextPlugin to extract common CSS into a CSS file.
      {
        test: /index\.less/,
        use: ExtractTextPlugin.extract({
          fallback: "style-loader",
          use: ["css-loader", "less-loader"]
        })
      },
      //Use URL-loader to include Fonts in the final package
      {
        test: /\.(otf|ttf|eot|woff|woff2|svg|png)$/,
        use: {
          loader: "url-loader",
          options: {
            name: "./_ui/dist/js/[hash].[ext]",
          },
        },
      }
    ]
  }
};

index.js

import $ from 'jquery';
import {PictureFill} from 'picturefill';
import {TextareaComponent} from './components/textarea-component';
import {NumberInputComponent} from './components/number-input-component';
import {DataAnimation} from './utils/data-animations';
import {AccordionComponent} from './components/accordion-component';
import {SelectComponent} from './components/select-component';
import {GlobalMessages} from './utils/global-messages';
import {CSRFFilter} from './utils/csrf-filter';
import {LiveChatComponent} from './components/live-chat-component';
import {TooltipComponent} from './cms/tooltip-component';
import {SpinnerInject} from './utils/spinner-inject';

window.picturefill = PictureFill;
window.$ = $;
window.jQuery = $;
window.TooltipComponent = TooltipComponent;

index.less

@import 'fonts';
@import 'icons';
@import 'variables';
@import 'common';
@import 'components/accordion';
@import 'components/modal';
@import 'components/pagination';
@import 'components/navbar';
@import 'components/buttons';
@import 'components/inputs';
@import 'components/tooltips';
@import 'components/global-messages';
@import 'components/simple-responsive-banner';
@import 'components/scroll-top';
@import 'components/live-chat';
@import 'components/carousel';

@import 'components/tiles';
@import 'pages/error-page';
@import 'components/footer';

//other less classes

package.json

{
  "name": "test",
  "version": "1.0.0",
  "description": "test",
  "main": "Gruntfile.js",
  "directories": {
    "lib": "lib"
  },
  "dependencies": {
    "@types/js-cookie": "^2.1.0",
    "@types/lodash.throttle": "^4.1.3",
    "@types/owl.carousel": "^2.2.1",
    "@types/picturefill": "^3.0.0",
    "babel-polyfill": "^6.26.0",
    "bootstrap": "^4.3.1",
    "font-awesome": "^4.7.0",
    "jquery": "^3.2.1",
    "js-cookie": "^2.2.0",
    "lodash.throttle": "^4.1.1",
    "owl.carousel": "^2.3.4",
    "picturefill": "^3.0.2",
    "popper.js": "^1.15.0",
    "reset-css": "^2.2.1"
  },
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.1",
    "babel-preset-es2015-ie": "^6.7.0",
    "css-loader": "^0.28.9",
    "eslint": "^4.17.0",
    "eslint-config-google": "^0.9.1",
    "eslint-loader": "^1.9.0",
    "eslint-plugin-import": "^2.8.0",
    "eslint-plugin-node": "^5.2.1",
    "eslint-plugin-promise": "^3.6.0",
    "eslint-plugin-standard": "^3.0.1",
    "extract-text-webpack-plugin": "^3.0.2",
    "file-loader": "^1.1.6",
    "less": "^2.7.3",
    "less-loader": "^4.0.5",
    "style-loader": "^0.19.1",
    "uglifyjs-webpack-plugin": "^1.1.6",
    "url-loader": "^0.6.2",
    "webpack": "^3.10.0",
    "webpack-livereload-plugin": "^1.0.0",
    "webpack-merge": "^4.1.2"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack --config webpack.common.js"
  },
  "author": "",
  "license": "ISC"
}