TypescriptでSassを{styles.〇〇}でスタイル適用させたい

Question

前提・実現したいこと

React, typescript, sass環境で開発をしたいと思っています。

<div className={styles.test}>

①このようにclassNameを指定して、スタイルを適用させたいです。
②また、いちいち.d.tsを書き直さなくて良い方法があれば知りたいです。

発生している問題

以下の書き方だと適用されない。

　<div className={styles.test}>

以下の書き方だと適用される。

　<div className="test">

該当のソースコード

import * as styles from "../styles/index.scss";
const App = () => {
	return(
		<div>
		　<div className={styles.test}>
		　　bbb
	　　　 </div>
		　<div className="test">
		　　aaaaaa
		</div>
	   </div>
    )
}

//index.scss
.test{
	color: red;
}

//index.scss.d.ts
export const test: string;

補足情報（FW/ツールのバージョンなど）

Answer 1

module.cssを使えばいいということがわかりました。