如何将引导程序包含到 webpack

如何解决如何将引导程序包含到 webpack

我正在尝试将引导程序包含到 webpack 中。在 IDE 中，我看到 bootstrap classe 的提示，我选择了它，但它不起作用。我需要以某种不同的方式加载吗？或者我可能需要手动加载引导程序并粘贴到 dist 文件夹？

我的项目结构：

-dist
     -bundle.js
     -index.html
-node_modules
-src
     -components
                -Main
                -Order
     -app.js
     -index.html
-package.json
-webpack.config.js

这是我的配置文件： 包.json

{
  "name": "wg-forge-js-welcome","version": "1.0.0","description": "Starter project for test task Wargaming Forge JS","main": "app.js","scripts": {
    "start": "webpack-dev-server --mode development --hot --colors --progress","build": "webpack --mode production --colors --progress","test": "echo \"Error: no test specified\" && exit 1"
  },"devDependencies": {
    "css-loader": "^5.0.1","express": "4.16.4","html-webpack-plugin": "3.2.0","style-loader": "^2.0.0","webpack": "4.28.4","webpack-cli": "3.2.1","webpack-dev-server": "3.1.14"
  },"dependencies": {
    "@popperjs/core": "^2.6.0","bootstrap": "^5.0.0-beta1","jquery": "^3.5.1"
  }
}

webpack.config.js

var express = require("express");
var path = require("path");
var HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
  entry: "./src/app.js",output: {
    path: path.resolve(__dirname,"dist"),filename: "bundle.js"
  },plugins: [
    new HtmlWebpackPlugin({
      template: "./src/index.html"
    })
  ],module: {
    rules: [
      {
        test: /\.css$/,use: ['style-loader','css-loader']
      }
    ]
  },devServer: {
    contentBase: path.join(__dirname,open: true,port: 9000,before: function(app,server) {
      app.use("/api",express.static(path.join(__dirname,"data")));
    }
  }
};

入口点

import {Main} from "./components/Main";
import 'bootstrap';

export default (function () {
    document.getElementById("app").innerHTML = Main();
}());