Configuring create-react-app with typescript / css modules

README.md

How to configure create-react-app with typescript / css modules

1. yarn create react-app app --template typescript
2. cd app/
3. yarn add -D typescript-plugin-css-modules
4. In the compilerOptions of tsconfig.json add typescript-plugin-css-modulesplugin "plugins": [{ "name": "typescript-plugin-css-modules" }]
5. touch src/global.d.ts
6. Add the following to global.d.ts

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

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

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

Done! You should now be able to, in your tsx files import styles: import styles from './File.module.css'