如何在Typescript中使用React Native？

Question

I've reading that React Native supports Typescript without dependencies like react-native-typescript-transformer . How do I configure it to code using Typescript ?

Answer 1

Since 0.57.0

With the upgrade to Babel v7, Typescript is supported but you will still need to make some changes to your application:

• Install type definition dependencies @types/jest @types/react @types/react-native @types/react-test-renderer
• Change your .js files to .ts or .tsx depending on whether such files contain JSX or not. Note : keep index.js as is, otherwise Metro builder will fail since it is still not updated to expect a .ts entry file.
• You will need to add module declarations for binary assets like images, videos and json files for Typescript to understand how to import them (example here ).

• For testing, Jest must be made aware of Typescript by adding the following to its configuration section in package.json :

   "jest": { "preset": "react-native", "moduleFileExtensions": [ "ts", "tsx", "js" ], "testRegex": "(/__tests__/.*|\\\\.(test|spec))\\\\.(ts|tsx|js)$" } 

Be aware that with this setup Babel just transforms Typescript to Javascript, it does not perform type-checking.

Also, expect possible issue since it is the first React Native release to support Typescript. My recommendation is to still follow the instructions below until things stabilize with time and patches.

Before 0.57.0

React Native does not offer first-party Typescript support. Instead, it offers Flow support out-of-the-box if you want types without having to add additional dependencies (other than flow-bin of course).

If you necessarily want Typescript, you will need to add some dependencies one way or another, depending on the setup you would eventually pick to use. There is a React Native blog post Using Typescript with React Native that explains one way to add Typescript.