Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Typescript error: DEV conflicts with React Native

See original GitHub issue

Intended outcome:

No typescript errors

Actual outcome:

When the client is used with react-native, Typescript throws an error:

node_modules/@apollo/client/utilities/globals/global.d.ts:2:11 - error TS2451: Cannot redeclare block-scoped variable '__DEV__'.

2     const __DEV__: boolean | undefined;
            ~~~~~~~

  node_modules/@types/react-native/index.d.ts:9904:11
    9904     const __DEV__: boolean;
                   ~~~~~~~
    '__DEV__' was also declared here.

How to reproduce the issue:

Create a react-native project from typescript template
Add @apollo/client
Make sure skipLibCheck in tsconfig is false
Run tsc

Versions

System: OS: macOS 11.5.2 Binaries: Node: 14.18.1 - /usr/local/opt/nvm/versions/node/v14.18.1/bin/node Yarn: 1.22.17 - /usr/local/bin/yarn npm: 6.14.15 - /usr/local/opt/nvm/versions/node/v14.18.1/bin/npm Browsers: Chrome: 95.0.4638.69 Firefox: 87.0 Safari: 14.1.2 npmPackages: @apollo/client: 3.4.16 => 3.4.16 apollo-link-timeout: 4.0.0 => 4.0.0

react-native: 0.66.2 typescript: 4.4.3

Issue Analytics

State:
Created 2 years ago
Reactions:1
Comments:7 (7 by maintainers)

Top GitHub Comments

1reaction

danilobuergercommented, Feb 16, 2022

@benjamn can confirm that 3.5.9 no longer produces the error. Thanks!

1reaction

benjamncommented, Feb 15, 2022

These changes are now available from npm in @apollo/client@3.5.9 (just published). Please give that version a try when you have a chance @szymn @danilobuerger @mitsuhiko!

Top Results From Across the Web

TypeScript and React Native, hundreds of errors from ...

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 ......

Using TypeScript - React Native

TypeScript is a language which extends JavaScript by adding type definitions, much like Flow. While React Native is built in Flow, ...

Troubleshooting | React Navigation

Error : While trying to resolve module "@react-navigation/native" from file "/path/to/src/App.js", the package ... npm install --save-dev typescript

TypeScript errors and how to fix them

TS1471: Module ' @headlessui/react ' cannot be imported using this construct. The specifier only resolves to an ES module, which cannot be imported ......

Integrating with Other Libraries - React

The easiest way to avoid conflicts is to prevent the React component from updating. You can do this by rendering elements that React...