Correct way to transpile SCSS files but not CSS files in Webpack 5

I have two entrypoints for stylesheets.

1. src/css/preprocess.scss
2. src/css/skippreprocessing.css

I want my Webpack 5 project to preprocess the SCSS file, but NOT the CSS file--I want the CSS file to just be published to the dist folder as-is.

I've included my best guess below. Something is wrong with it though; it breaks hot-reloading. Or rather, hot-reloading only works for the non-preprocessed file. It's like the two rules become linked somehow (I'm guessing because of the shared MiniCssExtractPlugin).

So I'm wondering, what's the correct way to make those two rules (handling CSS files and SCSS files) be considered completely separate things.

(Note: In my actual case I'm compiling JS files too, but I've removed those below for the sake of brevity.)

My Best Guess

const webpack = require('webpack');
const path = require('path');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    target: 'web',
    entry: {
        preprocess: [
            './src/css/preprocess.scss',
        ],
        skippreprocessing: [
            './src/css/skippreprocessing.css',
        ]
    },
    output: {
        path: path.resolve(__dirname, './dist'),
        filename: '[name].min.js',
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                exclude: /node_modules/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                ],
            },
            {
                test: /\.scss$/,
                exclude: /node_modules/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'postcss-loader',
                    'sass-loader'
                ],
            }
        ]
    },
    plugins: [
        new MiniCssExtractPlugin({
            filename: '[name].css',
        }),
        new HtmlWebpackPlugin({
            template: path.resolve(__dirname, './src/index.html'),
            filename: 'index.html',
            minify: false,
        }),
    ],
    devServer: {
        static: {
            directory: path.resolve(__dirname, './dist'),
        },
        hot: true,
        port: 8080,
    },
};