Css is not used by jsx in ReactJS

I use ReactJS with Webpack and TypeScript. I'm trying to include CSS with React. But my CSS is not use by my React application. I created a global.d.ts file to declare my css module. I imported my css into my.tsx file but when I add a class to an element, nothing works.

I have already tried to install a css module but I didn't succeed. So, I just made the solution to create a global.d.ts file

global.d.ts :

declare module '*.css';

Hello.tsx

import * as css from './Hello.css';
export interface HelloProps {

compiler: string;

framework: string;

}
export class Hello extends React.Component<HelloProps, {}> {
render() {

return (

<form>

<p className={css.test}> Test </p>

</form>

);

}

}

Hello.css

.test {

color: red;

}

webpack.config.js

module: {

rules: [

 .....

 { test: /\.css$/, exclude: /node_modules/, use: ['style-loader', 'css-loader'] }

]

},

The word “test” is written in black. When it should be in red

#css #reactjs #typescript