Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Typescript: Duplicated identifier between React Native and ES6 Lib #17

Closed
nicolashemonic opened this Issue Jun 25, 2018 · 8 comments

Comments

Projects
None yet
2 participants
@nicolashemonic
Copy link

nicolashemonic commented Jun 25, 2018

Expected results

  • Typescript should compile with success.
  • Typescript errors should be shown in the console.
  • React Native should not compile when a Typescript error occurred.

Observed results

Newly created project with the template doesn't compile successfully. Global type declaration of react-native/index.d.ts are in conflict with typescript/lib/lib.es6.d.ts. Furthermore, Typescript errors are not show in the console.

Logs

Find below errors shown in the console of a tsc command.

node_modules/@types/react-native/globals.d.ts:92:14 - error TS2300: Duplicate identifier 'RequestInfo'.

92 declare type RequestInfo = Request | string;
                ~~~~~~~~~~~

node_modules/@types/react-native/index.d.ts:8844:11 - error TS2451: Cannot redeclare block-scoped variable 'console'.

8844     const console: Console;
               ~~~~~~~

node_modules/@types/react-native/index.d.ts:8852:18 - error TS2717: Subsequent property declarations must have the same type.  Property 'geolocation' must be of type 'Geolocation', but here has type 'GeolocationStatic'.

8852         readonly geolocation: Geolocation;
                      ~~~~~~~~~~~

node_modules/@types/react-native/index.d.ts:8855:11 - error TS2451: Cannot redeclare block-scoped variable 'navigator'.

8855     const navigator: Navigator;
               ~~~~~~~~~

node_modules/typescript/lib/lib.es6.d.ts:21580:13 - error TS2451: Cannot redeclare block-scoped variable 'navigator'.

21580 declare var navigator: Navigator;
                  ~~~~~~~~~

node_modules/typescript/lib/lib.es6.d.ts:21756:13 - error TS2451: Cannot redeclare block-scoped variable 'console'.

21756 declare var console: Console;
                  ~~~~~~~

node_modules/typescript/lib/lib.es6.d.ts:21813:6 - error TS2300: Duplicate identifier 'RequestInfo'.

21813 type RequestInfo = Request | string;

Steps to reproduce

  1. Create project: react-native init ReactNativeTest --template typescript && node ReactNativeTest/setup.js
  2. Compile Typescript (v2.9.2) manually to show errors: tsc (or npm run tsc with corresponding command in package.json)

Solution

  1. Specify in tsconfig.json valid library files to be included in the compilation. React Native is built on top of ES6 so that would be enough: "lib": [ "es6" ]

  2. @emin93 At least, it could be great if we can have Typescript output to debug app because sometimes:

  • The app can run with Typescript errors triggered silently in the background without any log
  • The React Native bundle.js is not generated when an error occurred and no log specifies the reason

emin93 added a commit that referenced this issue Jul 3, 2018

Update tsconfig.json
addressed issue (#17) which caused typescript to fail compilation of a newly created project
@emin93

This comment has been minimized.

Copy link
Owner

emin93 commented Jul 3, 2018

Hi @nicolashemonic and sorry for my delayed answer, I was on vacation last week.

Thank you for the well done issue report. I tested it locally and I could reproduce the issue. As you described, defining the ES6 base typings with the lib option seems to be enough to fix this issue.

I added this to the latest master branch. I will wait with the release for the next React Native version 0.56 which should be released very soon.

About the TypeScript output, I fully agree with you. I guess it's the noEmit option which is required by the react-native-typescript-transformer that causes this behaviour. I will check if it's somehow possible to enable logging the TypeScript output.

@emin93 emin93 self-assigned this Jul 3, 2018

@emin93 emin93 added the bug label Jul 3, 2018

@nicolashemonic

This comment has been minimized.

Copy link
Author

nicolashemonic commented Jul 3, 2018

I hope you enjoyed your vacation :)

All right, thanks @emin93 !

@emin93

This comment has been minimized.

Copy link
Owner

emin93 commented Jul 3, 2018

I did indeed 😄

Sadly it seems it's not possible to enable error reporting in the react-native-typescript-transformer at this moment:
ds300/react-native-typescript-transformer#15
ds300/react-native-typescript-transformer#29

I'll keep an eye on this and as soon as there's a solution for it, I'll include it in this template.

@nicolashemonic

This comment has been minimized.

Copy link
Author

nicolashemonic commented Jul 3, 2018

Running tsc to debug or before commit could be a temporary solution but not replace a build time error reporting ( ds300/react-native-typescript-transformer#15 (comment) ). I hope React Native Typescript Transformer will find a solution for this.

Thanks for your help 🙂

@emin93

This comment has been minimized.

Copy link
Owner

emin93 commented Jul 5, 2018

FYI: Version 3.0.4 has been released, which includes your fix. 😃

@nicolashemonic

This comment has been minimized.

Copy link
Author

nicolashemonic commented Jul 5, 2018

Great ! I didn't find release note, v3.0.4 includes React Native v0.56 rc ? 😋

@emin93

This comment has been minimized.

Copy link
Owner

emin93 commented Jul 5, 2018

I know, I should start writing release notes... 😅

The React Native CLI will always use the latest available React Native version (which currently is 0.56) and then setup the template. So yes, when you create a new project with the init command (react-native init MyApp --template typescript && node MyApp/setup.js ) it will create a new React Native 0.56 project.

@nicolashemonic

This comment has been minimized.

Copy link
Author

nicolashemonic commented Jul 5, 2018

Excellent ! Thank you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.