Created a react-native starter project with Typescript which could run 2 weeks ago. Now when I try to run the project it gives error during the typescript compilation.
Using skipLibraryCheck: true in tsconfig.json fixes the error. But why is it throwing errors from ~/.nvm and ./node_modules directories?
Error (Updated for node_modules/.bin/tsc):
> node_modules/.bin/tsc node_modules/@types/react-native/index.d.ts(8742,11): error TS2451: Cannot redeclare block-scoped variable 'console'. node_modules/@types/react-native/index.d.ts(8750,18): error TS2717: Subsequent property declarations must have the same type. Property 'geolocation' must be of type 'Geolocation', but here has type 'GeolocationStatic'. node_modules/@types/react-native/index.d.ts(8753,11): error TS2451: Cannot redeclare block-scoped variable 'navigator'. node_modules/redux-thunk/index.d.ts(4,47): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux-thunk/index.d.ts(8,20): error TS2428: All declarations of 'Dispatch' must have identical type parameters. node_modules/redux/index.d.ts(115,18): error TS2428: All declarations of 'Dispatch' must have identical type parameters. node_modules/redux/index.d.ts(161,13): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(283,42): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(283,53): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(302,66): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(302,77): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(303,38): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(384,95): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(389,33): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(391,106): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/redux/index.d.ts(396,34): error TS2314: Generic type 'Dispatch<A, S>' requires 2 type argument(s). node_modules/typescript/lib/lib.es6.d.ts(21612,13): error TS2451: Cannot redeclare block-scoped variable 'navigator'. node_modules/typescript/lib/lib.es6.d.ts(21788,13): error TS2451: Cannot redeclare block-scoped variable 'console'. Project details:
❯ react-native info Environment: OS: macOS High Sierra 10.13.4 Node: 9.11.1 Yarn: 1.6.0 npm: 6.0.0 Watchman: 4.9.0 Xcode: Xcode 9.2 Build version 9C40b Android Studio: 2.3 AI-162.3934792 Packages: (wanted => installed) react: 16.3.1 => 16.3.1 react-native: 0.55.3 => 0.55.3 package.json
{ "name": "hello-world-rn", "version": "0.0.1", "private": true, "scripts": { "build": "npm run clean && npm run tsc --", "clean": "rimraf lib", "lint": "tslint src/**/*.ts", "start": "node node_modules/react-native/local-cli/cli.js start" }, "dependencies": { "native-base": "2.4.3", "react-native": "0.55.3", "react-redux": "5.0.7", "redux": "4.0.0", "redux-thunk": "2.2.0" }, "devDependencies": { "@types/jest": "22.2.3", "@types/react": "16.3.13", "@types/react-native": "0.55.8", "@types/react-redux": "5.0.19", "@types/react-test-renderer": "16.0.1", "babel-core": "6.26.3", "babel-jest": "22.4.3", "babel-preset-react-native": "4.0.0", "concurrently": "3.5.1", "eslint": "4.19.1", "jest": "22.4.3", "react": "16.3.1", "react-test-renderer": "^16.3.0-alpha.1", "rimraf": "2.6.2", "tslint": "5.9.1", "tslint-config-prettier": "1.12.0", "tslint-eslint-rules": "5.1.0", "tslint-react": "3.5.1", "typescript": "2.8.3" }, "jest": { "preset": "react-native", "testRegex": "lib/.+\\.(test|spec).js$", "coverageDirectory": "coverage", "coverageReporters": [ "text-summary", "html" ] }, "collectCoverageFrom": [ "lib/**/*.js", "!lib/**/*.spec.js", "!lib/**/*.index.js" ] } tsconfig.json
{ "compilerOptions": { "target": "es6", "module": "commonjs", "jsx": "react-native", "sourceMap": true, "outDir": "./lib", "strict": true, "types": ["react", "react-native", "jest"], "esModuleInterop": true, "skipLibCheck": false }, "compileOnSave": false, "exclude": ["./android/*", "./ios/*", "./lib/*", "./node_modules/*"], "filesGlob": ["typings/index.d.ts", "src/**/*.ts", "src/**/*.tsx"], "types": ["react", "react-native", "jest"] } 2 Answers
Answers 1
I can't really tell you what went through now and then which broke the typings, I can mostly give hints...
- When you call
tscfrom the terminal, it will use the global version of typescript, including its core typings, this is from where you are getting the ".nvm" errors. It is recommended that you use a local version (node_modules/.bin/tsc). - I suggest you try adding "moduleResolution: node". I don't know why, just try it, maybe it fixes something.
- I'm not sure
redux-thunktypings properly work with the newredux@4.x. Might be the source of your errors.
I usually just leave "skibLibCheck" on, we never know when libs were written with older versions of TS in mind, or even without the "strict" flag in mind.
EDIT FROM COMMENTS
- Seems react-native adds his own version of the base javascript typings, so you can disable the ones probided by TS through the
libflag, so they don't conflict.
Answers 2
I ran into the "must be of type 'Geolocation'" one. Still trying to figure out how exactly to fix it, but in @types/react-native, Geolocation is defined as an alias of GeolocationStatic, but Geolocation is also a typescript type, and it needs to be the typescript type, not the @types/react-native type. It looks like the only place within @types/react-native/index.d.ts the Geolocation alias is used is
interface Navigator { readonly product: string; readonly geolocation: Geolocation; } Geolocation is assigned
export var Geolocation: GeolocationStatic; export type Geolocation = GeolocationStatic; Commenting these guys out after running npm install makes it work. I put it in an npm postinstall powershell script.
Yes, yes, it's hacky, and I'm positive there's a smooth, good solution to this. But if you just want it working and don't depend on these elsewhere, it could work. Another potential solution would be just to rename them.
Did some more snooping, looks like this is the official recommendation for the moment. Gotta love hacky fixes! https://github.com/DefinitelyTyped/DefinitelyTyped/issues/24573
0 comments:
Post a Comment