TSLint throws error with this example here: https://www.styled-components.com/docs/api#typescript

Hi,

I'm trying to get styled-components to work with TypeScript but I'm facing some issues. I've followed this example here: https://www.styled-components.com/docs/api#typescript

In this code:

import ThemeInterface from './theme';

const {
  default: styled,
  css,
  injectGlobal,
  keyframes,
  ThemeProvider,
} = styledComponents as ThemedStyledComponentsModule<ThemeInterface>;

export { css, injectGlobal, keyframes, ThemeProvider };
export default styled;

Typescript is throwing the following error:

   TS2352: Type 'typeof "/Users/xxxx/xxxxx/React/TypeScriptWithReact/node_modules/styled-components/t...' cannot be converted to type 'ThemedStyledComponentsModule<ThemeInterface>'.
  Types of property 'ThemeProvider' are incompatible.
    Type 'ComponentClass<ThemeProviderProps<object>>' is not comparable to type 'ComponentClass<ThemeProviderProps<ThemeInterface>>'.
      Type 'ThemeProviderProps<object>' is not comparable to type 'ThemeProviderProps<ThemeInterface>'.
        Type 'object' is not comparable to type 'ThemeInterface'.
          Property 'primaryColor' is missing in type '{}'.

My theme.ts file looks like this:

export default interface ThemeInterface {
  primaryColor: string;
  primaryColorInverted: string;
}

Also, I'd like to know if I need to import styled from this file styled-components.ts or do I need to still import styled from 'styled-components' from node-modules?

Any help would be appreciated. Thank you

patrick91 / Styled-Components-Typescript-Example

TSLint throws error with this example here: https://www.styled-components.com/docs/api#typescript #4