CSS Modules aren't being loaded in any React Component

Question

I am attempting to utilize CSS Modules for styling my components, however they do not see to be applied.

I've created my React App using Create-React-App, which includes React(18.2.0) and ReactScripts(5.0.1). The WebPack configuration is the default generated by Create-React-App

Folder Structure Representation for Component:
/mypage
-- MyPage.js
-- MyPage.module.css

Simplified Component Minus unrelated logic:

import styles from "./MyPage.module.css";    

export const MyPage = () => {

    return (
        <div>
            <h2  className={styles.headerTest}>Pack Guide Page Test</h2>
        </div>
    );
}

MyPage.module.css contents:

.header-test {
    color: red;
}