Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

TypeScript and React Native, hundreds of errors from node_modules/@types when compiling

Tags:

typescript

I am currently migrating my RN project to TypeScript. I have finished the majority of my JS code, and now when I run tsc I get several hundred errors that all seem to be

error TS 2717: Subsequent property declarations must have the same type. Property
  prop must be of the type TYPE,
  but here has type TYPE

for example:

error TS2717: Subsequent property declarations must have the same type.  Property
  'view' must be of type 'SVGProps<SVGViewElement>',
  but here has type 'SVGProps<SVGViewElement>'.

which is doubly confusing because the listed types are almost always identical.

I am able to run my app, I am still getting useful messages from tslint, and any errors specific to my code appear at the bottom of the list of compiler errors.

My tsconfig.json is currently:

{
  "compilerOptions": {
    "allowJs": true,
    "target": "es2018",
    "outDir": "dist",
    "module": "commonjs",
    "sourceMap": true,
    "lib": ["esnext", "es7", "dom", "es6"],
    "jsx": "react-native",
    "strict": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "types": ["react-native"]
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.spec.ts"]
}

I've tried various solutions, including setting types to [] as per the TypeScript docs and setting exclude to various forms of node_modules such as ./node_modules, node_modules/* etc but none of these changes have had any effect.

like image 228
Robbie Milejczak Avatar asked Jan 10 '19 19:01

Robbie Milejczak


1 Answers

Okay I was able to solve this. I'm not totally sure how dependencies are managed via yarn but my problem was definitely dependencies.

First I removed all my @types/* libraries from my dependencies, and then I deleted my node modules folder.

Then, despite what the majority of tutorials and guides will say, I installed only @types/react-native and not @types/react. @types/react-native added the react typings on its own. I'm thinking that the typings for @types/react maybe depended on the node typings, and by explicitly installing them I introduced a bunch of conflicts both between @types/react-native and @types/node as well as between @types/react-native and @types/react. My project compiles without error now.

like image 135
Robbie Milejczak Avatar answered Oct 28 '22 03:10

Robbie Milejczak