index.js console.log не достигается

Question

У меня есть файл index.js с простым console.log(), и он не регистрируется в браузере. Я также заметил, что начальная загрузка не работает - я почти уверен, что эти два события связаны, но я не уверен, как правильно диагностировать проблемы. Я пытался перемещать код, менять пути, искать пропущенные запятые и т. Д., Но безрезультатно.

Я компилирую файлы с webpack.config.js и, насколько мне известно, мой код компилируется правильно.

Есть мысли по этому поводу?

index.js:

import 'jquery';
import "./SiteAssets/scripts/addRow.js";
import "./RecruitmentTracking.css";

import 'bootstrap/dist/js/bootstrap.bundle.min.js';
import 'jquery-ui-bundle/jquery-ui.min.js';

console.log('this is index.js');

const root = document.createElement("div")
root.innerHTML = `<p>Hello Webpack.</p>`
document.body.appendChild(root)

webpack.config.js:

const path = require('path')
const webpack = require('webpack');
// const babel = require("@babel/core");
const HtmlWebpackPlugin = require('html-webpack-plugin')
var $ = require("jquery");

var HtmlWebpackPluginConfig = new HtmlWebpackPlugin({
    template: './src/index.html',
    filename: 'RecruitmentTracking.txt',
    inject: 'body'
});

module.exports = {                                         
  entry: "./src/index.js", // "compile code in our entry point"
  output: {
    filename: 'bundle.js', // output a bundle in /dist"
    path: path.resolve(__dirname, 'dist')
  },
  module: {
    rules: [{
      loader: 'babel-loader',
      test: /\.js$/,
      exclude: /node_modules/
    }, {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
    }, {
        test: /\.(png|svg|jpg|gif)$/,
        use: [
          'file-loader'
        ]
      }
    ],
  },
    devServer: {
      disableHostCheck: true
    },
    devtool: 'cheap-module-eval-source-map', // this helps to browser to point to the exact file in the console, helps in debug
    devServer: {
      contentBase: path.join(__dirname, 'src'),
      historyApiFallback: true // this prevents the default browser full page refresh on form submission and link change
    },    
  plugins: [
    HtmlWebpackPluginConfig,
    new webpack.ProvidePlugin({
        "$": "jquery",
        "jQuery": "jquery",
        "window.jQuery": "jquery"
    })
  ],  
}

package.json:

"scripts": {
    "build": "webpack --mode production",
    "dev-server": "webpack-dev-server",
    "develop": "webpack --mode development --watch",
    "start": "webpack-dev-server --open --mode development"
  },

ScreenCap: