CSS not being applied when using with React, Typescript and typescript-plugin-css-modules

Viewed 452

I have a setup with React and Typescript and I am trying to import and use CSS modules. I have installed the typescript-plugin-css-modules and changed the tsconfig.json by adding "plugins": [{ "name": "typescript-plugin-css-modules" }]. Also, I have a Global.d.ts that includes

declare module "*.module.css" {
  const classes: { [key: string]: string };
  export default classes;
}

This is my webpack.config.js

{
   test: /\.css$/,
   use: [
      "style-loader",
      {
         loader: "css-loader",
         options: {
             modules: true,
         },
      },],
},

Now the import inside the React components works but they are not being applied/rendered.

import styles from "./mystyle.module.css"
<span className={styles.StyledSpan}>text</span>

What can I be missing in this configuration?

0 Answers
Related