How can I make webpack compile styles before other entries?

Question

I want to use a PostCSS plugin that gives me type safety for classnames (postcss-ts-classnames). It generates a .d.ts file with classNames, as a postcss-plugin. I want to use this to make sure that the JS and CSS say in sync, and we don't keep old classnames around. The current setup works, but only after the first build. I'd like to force webpack to compile the CSS first, so the .d.ts file is always present during the TypeScript compilation.

Ideally I'd like to say to webpack "hey, compiling this will produce a file as byproduct, and another compilation depends on this byproduct".

webpack.config.js

const path = require('path');

module.exports = {
    mode: 'development',
    entry: ['./index.ts', './index.css'],
    module: {
        rules: [
            {
                test: /\.css$/i,
                use: [
                    "style-loader",
                    "css-loader",
                    "postcss-loader"
                ],
            },
            {
                test: /\.tsx?$/,
                use: 'ts-loader',
                exclude: /node_modules/,
            },
        ],
    },
};

postcss.config.js

module.exports = {
    plugins: [
        require("postcss-ts-classnames")({
            dest: "classnames.d.ts",
        }),
    ]
}

I don't think the css/ts matter that much, but I put a full (non)-working sample on https://gist.github.com/marijnvdwerf/f44143b6c4cdc7d5c42120bb9eb24744.