Amplify-js: Using aws-amplify-react-native with Typescript?

[kevinsperrine]

Is it possible to use aws-amplify-react-native with Typescript? If I don't include the @types/node definitions I get lots of errors about 'stream', 'Buffer', 'http', and other node types missing, but If I include the @types/node definitions then I get a duplicate 'require' error. What's the work-around here? I know RN isn't a full node environment, so I'm not even sure exactly which types are available to the aws-sdk.

# without @types/node
node_modules/aws-sdk/clients/acm.d.ts(108,37): error TS2304: Cannot find name 'Buffer'.
node_modules/aws-sdk/clients/acm.d.ts(110,38): error TS2304: Cannot find name 'Buffer'.
node_modules/aws-sdk/clients/acm.d.ts(401,32): error TS2304: Cannot find name 'Buffer'.
node_modules/aws-sdk/clients/apigateway.d.ts(1146,23): error TS2304: Cannot find name 'Buffer'.
node_modules/aws-sdk/clients/appsync.d.ts(240,23): error TS2304: Cannot find name 'Buffer'.
node_modules/aws-sdk/clients/clouddirectory.d.ts(1469,38): error TS2304: Cannot find name 'Buffer'.
node_modules/aws-sdk/clients/cloudsearchdomain.d.ts(7,24): error TS2307: Cannot find module 'stream'.
node_modules/aws-sdk/clients/cloudsearchdomain.d.ts(42,23): error TS2304: Cannot find name 'Buffer'.
# ... truncated for brevity.

# with @types/node
node_modules/@types/node/index.d.ts(140,13): error TS2300: Duplicate identifier 'require'.
node_modules/@types/react-native/index.d.ts(8630,14): error TS2300: Duplicate identifier 'require'.

[powerful23]

@kevinsperrine so you are using typescript to develop a react native app? Could you give more details about how you are using the library with Typescript?

[kevinsperrine]

@powerful23 Yes, exactly. I've created a minimum repo here https://github.com/kevinsperrine/aws-amplify-react-native-typescript-test. I created it with:

create-react-native-app amplify-test --scripts-version=react-native-scripts-ts
cd amplify-test/
yarn add aws-amplify{,-react-native}
yarn upgrade-interactive --latest
yarn eject

So, I'm seemingly stuck because both @types/node and @types/react-native define their own version of require. The only solution I see is to use skipLibCheck in tsconfig.json, or copy out my own minimal @node/types that are needed by the aws-sdk. Cross reference: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/15960

[kevinsperrine]

FWIW: I just added a postinstall script package.json to comment out the Node require definition and use react-native's version instead since that's the environment I'm actually working in.

#!/bin/sh
# postinstall.sh

# TL;DR node require() and react-native require() types conflict, so I'm
# commenting out the node type definition since we're in a RN env.
# https://github.com/DefinitelyTyped/DefinitelyTyped/issues/15960
# https://github.com/aws/aws-amplify/issues/281
# https://github.com/aws/aws-sdk-js/issues/1926
sed -i '' "s/\(^declare var require: NodeRequire;\)/\/\/\1/g" node_modules/\@types/node/index.d.ts

[pynner]

Have you made any progress on this issue? Facing same thing

[rasmus-storjohann-PG]

On Ubuntu I needed to tweak the sed call

sed -i -e "s/\(^declare var require: NodeRequire;\)/\/\/\1/g" node_modules/\@types/node/index.d.ts