TypeScript Definitions Missing

Currently I can’t compile my typescript react project when trying to use the new styled-components/primitives library extension because typings definitions are not present for the react-primitives repository. There is also no @types/react-primitives present either.

[sullvn]

As @mathieudutour suggested, you can import the types from @types/react-native.

I got it working by making a src/@types/react-primitives/index.d.ts file with the following contents:

declare module 'react-primitives' {
  export {
    StyleSheet,
    View,
    Text,
    Image,
    Touchable,
    Animated,
  } from 'react-native'
}

There will be one more step if you’re using React Primitives in a Webpack build. Webpack and React Native both declare global, incompatible type definitions for require.

So you’ll have add the following to your tsconfig.json to just avoid type-checking node_modules (which is faster anyways):

{
  "compilerOptions": {
    // Required for using `react-primitives` types, but
    // also makes typechecking faster in general.
    //
    // The problem actually stems from this project using
    // `@types/react-native` to fake types for `react-primitives`.
    // React Native and Webpack both define a global `require`
    // differently, so there's a conflict.
    "skipLibCheck": true,
  }
}

Hopefully that helps!

I would normally make a PR to this repo or DefinitelyTyped to just add these, but I’m not familiar enough with React Native and Primitives to know if it’s truly a one-to-one types match. Can someone more in-the-know help with that?

[brunolemos]

Someone posted a similar code from above on DefinitelyTyped so you can do this now: yarn add --dev @types/react-primitives.