I am refactoring project which has a working webpack bundling. Basically, I am trying to change the root source folder of the project and I am having an issue. I have been debugging for so long but I cannot see what I am missing.

In my tsconfig.json file I have the following settings

    "baseUrl": "./",
    "paths": {
        "src/*": [
            "src/*"
        ],
        "test/*": [
            "test/*"
        ]
    }

In the webpack.common.js file I have the following

const includePaths = ['node_modules', 'src'];
resolve: {
    extensions: ['.ts', '.tsx', '.js', '.jsx'],
    modules: includePaths,
},

My source folder is in the root of my project. Basically I should be able to reach with ./src

This is how I bundle:

rm -rf ./build && webpack --config webpack.dev.js

webpack.dev.js

merge(common, config, {
    entry: {
        main: [
            `${__dirname}/src/environment`,
            'webpack-hot-middleware/client?path=__webpack_hmr&dynamicPublicPath=true',
            `${__dirname}/src/main`,
        ],
    },

When I run the bundler in watch mode I see something like:

These dependencies were not found:
src/<somefolder>/<somefile> in ./src/<somefolder>/<somefile.tsx>

Module not found: Error: Can't resolve ...

The weird thing is, when src folder was under another folder eg. frontend/src, it was bundling without an issue. I suspect something is off in the tsconfig but I cannot figure it out. Can someone please help?