`babel-plugin-react-css-modules` Typescript Type Checking

Question

I am using babel-plugin-react-css-modules. It add the styleName property to HTML elements. Typescript doesn't recognize this property. I am pretty sure I need to extend something but nothing I have tried has worked.

I have tried declaring an Element in a '.d.ts' file to do declaration merging but I must be doing something wrong.

interface Element {
    styleName: string;
}

export const Wrapper: React.FC<IWrapperProps> = ({ children, style }) => (
  <div styleName="wrapper" style={style}>
    {children}
  </div>
);

UPDATE:

.d.ts not working

Answer 1

Add @types/react-css-modules to your package.json and styleName will be recognized:

npm install @types/react-css-modules --save-dev