Problem with filename and path resolve in Webpack with React

I have following webpack config settings for .css, .js files:

const cssLoaders = (extra) => {
    const loaders = [{
        loader: MiniCssExtractPlugin.loader,
        options: {
            hmr: isDev,
            reloadAll: true
        }
    },
    {
        loader: require.resolve('css-loader'),
        options: {
            importLoaders: 1,
            modules: {
                localIdentName: '[path][name]__[local]--[hash:base64:5]',
            },
        }
    },
    ];

    if (extra) {
        loaders.push(extra);
    }

    return loaders;
};

const filename = ext => isDev ? `[name].${ext}` : `[name].[contenthash].${ext}`;
.
.
.
module.exports = {
    context: path.resolve(__dirname, 'src'),
    mode: 'development',
    entry: {
        main: ['@babel/polyfill', './index.jsx']
    },
    output: {
        filename: filename('js'),
        path: path.resolve(__dirname, 'dist')
    },
.
.
.
plugins: [
        new MiniCssExtractPlugin({
            filename: filename('css'),
        })
    ],
.
.
.
module: {
        rules: [
            {
                test: /\.css$/,
                use: cssLoaders()
            },
            {
                test: /\.less$/,
                use: cssLoaders('less-loader')
            },
            {
                test: /\.s[ac]ss$/,
                use: cssLoaders('sass-loader')
            },
.
.
.

The problem is when I add new page (react component) with a new path (/car/model/:id) I see an error that webserver cannot find files:

Can't find http://localhost:4200/cars/model/main.css

Can't find http://localhost:4200/cars/model/main.js

I also have root Application component with following routing code:

class Application extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
            <div className={Styles.container}>
                <Switch>
                    <Route exact path="/" component={Catalogue} />
                    <Route exact path="/cars/model/:id" component={CarModel} />
                    <Route path="*" component={NotFound} />
                </Switch>
            </div>
        );
    }
}

Everything is ok for the main page, it renders well.

<Route exact path="/" component={Catalogue} />

What should I change to fix it for <Route exact path="/cars/model/:id" component={CarModel} /> ?