How to import scss file as variable in react with typescript

Question

I am unable to import scss file in below format.

import * as styles from './index.scss';

getting below error :

can not find module './index.scss'

I want to use class name like below :

className={styles.anyClassName}

Answer 1

In order to import SCSS as object in TS like this :

import * as styles from './index.scss';

• Create file 'global.d.ts' in your source directory (or outside, but must be included in the src directory defined in tsconfig)
• Add the following code inside

declare module '*.scss' {
  const content: {[className: string]: string};
  export = content;
}

https://basarat.gitbooks.io/typescript/docs/types/ambient/d.ts.html